子组件给父组件(页面)传值

子组件:
点击事件传值

       <div class="search-scan">
            <div>
              <van-row>
                <van-col :span="12">
                  <div :class="[fla,'scan-search-year']" style="font-size:3vw;"
                       @click="onBindColumn">{{selectColumn}}<i class="el-icon-caret-bottom"></i></div>
                  <div :class="[fla,'scan-search-year']" style="font-size:3vw;"
                       @click="onBindDir">{{selectDir}}<i class="el-icon-caret-bottom"></i></div>
                </van-col>
                <van-col :span="12">
                  <div :class="[fla,'scan-search-box']">
                    <input type="text" ref="search" v-model="search">
                    <button class="search-btn" @click="toSearch()">搜索</button>
                  </div>
                  <div :class="[fla,'high-search-box']" @click="toHighSearch">高级搜索</div>
                </van-col>
              </van-row>
            </div>
          </div>

js:
      toSearch(){
          this.$emit('child-event',this.cid,this.did,this.search)
  },

父组件(页面):

 <Searching @child-event="toSearch"></Searching>

直接写方法:
data代表传过来的值 ...data表示数组

 toSearch(...data){
            if(this.search !== ''){
              this.$api.post(
                `/msdg/no/content/getpuso`,
                {
                  "content":{
                    "page":1,
                    "size":10,
                    "word":data[2],
                    "column_id":data[0],
                    "direction_id":data[1]
                  }
                },
                res =>{
                  switch (res.code){
                    case 500:
                      Toast(res.msg);
                      break;
                    case 0:
                      console.log('搜索')
                      console.log(res)
                      this.qkList= res.data.list
                      break;
                  }
                }
              )
            }else{
              Toast('请输入搜索内容')
            }
          },
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容