账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    element-ui,select组件远程搜索时this指向有问题,麻烦各位帮忙看下
    35
    0

    第一次搜索是数据能正常渲染,第二次this指向就有问题了

    我试过定义一个变量把this付给这个变量,但还是不行

    <el-select
              v-model="seller"
              filterable
              remote
              reserve-keyword
              placeholder="请输入商家名称"
              :remote-method="sellerList"
              :loading="seller.loading">
              <el-option
                v-for="item in seller.list"
                :key="item.id"
                :label="item.account"
                :value="item.id">
              </el-option>
            </el-select>
    <script>
      var that;
      export default {
        data () {
          return {
            seller:{
              list:[],
              newlist:[],
              loading: false
            }
          }
        },
        beforeCreate(){
          that = this;
        },
        mounted() {
    
        },
        methods: {
          
          //查询商家
          sellerList(name){
            that.seller.loading = true
            this.$http({
              url: this.$http.adornUrl(`/shop/seller/all`),
              method: 'get'
            }).then(({data}) => {
              that.seller.loading = false
              if (data && data.code === 0) {
                that.seller.list = data.list
              } else {
                that.seller.list = []
                this.$message.error(data.msg)
              }
            })
          }
        }
      }
    

    麻烦帮忙看下有什么办法可以解决这个问题

    0
    打赏
    收藏
    点击回答
    您的回答被采纳后将获得:提问者悬赏的 11 元积分
        全部回答
    • 0
    • 轩辕神邸 普通会员 1楼

      在Element UI的Select组件中,this关键字用于引用组件内部的属性或方法。如果你在进行远程搜索时,发现this指向有问题,这可能是由于以下原因:

      1. 如果你直接在组件内部定义了this,并将其绑定到组件实例的属性上,那么在进行远程搜索时,this将指向组件实例本身,而不是你的全局对象。

      2. 如果你在一个父组件中使用了this,但是在这个父组件中没有定义this,那么this将指向全局对象。

      如果你的情况是上述原因之一,你可能需要考虑使用bind(this)方法来更改this的指向。例如:

      ```jsx <el-select bind-model="selectedOption" placeholder="选择一个城市..."

      <el-option v-for="(item, index) in cities" :key="index" :label="item.label" :value="item.value"

      {{ item.label }}
      

      ```

      在这个例子中,bind-model方法将selectedOption绑定到cities列表的value属性上,从而改变了this的指向。

    更多回答
    网站公告
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部