关于uni-app:uniapp新增步骤条不知道有多少步骤

8次阅读

共计 800 个字符,预计需要花费 2 分钟才能阅读完成。

1. 开发环境 uni-app+uView
2. 电脑系统 windows10 专业版
3. 在应用 uni-app+uView 开发的过程中, 咱们常常在新增的时候新增步骤, 然而不晓得有多少步骤, 因而不能写死, 上面我来分享一下我的办法, 心愿对你有所帮忙。
4. 废话不所说, 间接上代码, 在 return 中增加如下代码:

projectstepsObj:{
        num:"0",
        chenarr:[],
        con:"",
      },
      chenarrObj:{
        num:0,
        id:"",
        con:""
      }

5. 在新增事件中增加如下代码:

chenfonts(){
      this.projectstepsObj.num+=1;
      this.chenarrObj.num=this.projectstepsObj.num;
      this.chenarrObj.id=this.projectstepsObj.num;
      this.chenarrObj.con="";
      this.projectstepsObj.chenarr.push(this.chenarrObj);

      // console.log(this.projectstepsObj.chenarr);
      
    }

6. 在 template 中增加如下代码:

<u-form-item v-for="(item,index) in projectstepsObj.chenarr" 
:key="index" 
:label="'我的项目第'+`${index+1}`+'步'">
        <u-input v-model="item[index]"
      />
      </u-form-item>

7. 在提交办法中增加如下代码:

chensubmit() {console.log("++++++");
      console.log(this.chenarrObj);
      console.log("--------");
}

8. 成果如下:

9. 本期的分享到了这里就完结啦, 心愿对你有所帮忙, 让咱们一起致力走向巅峰!

正文完
 0