element-ui的选择实现上拉刷新和回显

2023-12-26 16:06:32
                    <el-select
                      v-model="ruleForm.listId"
                      v-loadmore="devLoadmore"
                      style="width:220px"
                      filterable
                      placeholder="请选择"
                      size="small"
                      clearable
                    >
                      <el-option
                        v-for="(item, index) in list"
                        :key="index"
                        :label="item.name"
                        :value="item.id"
                      />
                    </el-select>

**

初始化回显

凑一项在数组push进去

    // 初始化添加数组
    initResourcePage() {
      return resourcePage({
        ...this.devArrForm
      }).then(res => {
        const { result } = res.data
        this.vppDevListArrLength = res.data.total
        let tempObj= result.find(item=> item.id=== this.templateInfo.id)
        if (this.templateInfo.name&& !tempObj) {
          this.list= [{
            id: this.templateInfo.id,
            name: this.templateInfo.name
          }, ...result]
        } else {
          this.list= result
        }
      })
    },

上拉函数

    devLoadmore() {
      if (this.list.length !== this.devArrLength - 1) {
        this.devArrForm.page++
        resourcePage({
          ...this.devArrForm
        })
          .then((res) => {
            const { result } = res.data
            this.devArrLength = res.data.total
            for (let i = 0; i < result.length; i++) {
              if (this.ruleForm.parentResourceId !== result[i].resourceId) {
                this.list.push(result[i])
              }
            }
          })
          .catch(() => {})
      }
    },

文章来源:https://blog.csdn.net/weixin_45408578/article/details/135221298
本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。