How to realize the splicing function of multiple field values with VUE + Element

This article introduces the knowledge of "VUE + Element how to achieve multiple field value splicing function". In the operation of actual cases, many people will encounter such a dilemma, so let the editor lead you to learn how to deal with these situations. I hope you can read it carefully and be able to achieve something!

Screenshot of the effect:

VUE core function code snippet:

/ / get the public notification list getUsers () {let para = {page: this.page, title: this.filters.title} This.listLoading = true; / / NProgress.start (); getNoticeListPage (para). Then ((res) = > {this.total = res.data.total Let str =''for (let I = 0; I

< res.data.notices.length; i++) { str = res.data.notices[i].startDt + '~' + res.data.notices[i].endDt; res.data.notices[i].timeRang = str } this.notices = res.data.notices; this.listLoading = false; //NProgress.done(); }); }, 总结：定义常量str, 遍历后台返回数据，常量str 的赋值表达式是： str = res.data.notices[i].startDt + '~' + res.data.notices[i].endDt; 再向res.data.notices 数组对象中设置新的属性值，并赋值： res.data.notices[i].timeRang = str 补充：下面看下vue各种字符串拼接方法 1、文件绑定{undefined{}}中的字符串拼接：直接在{undefined{}}内拼接： {{item.userName+'('+item.userAccount+')'}} 2、vue标签属性绑定中的字符串拼接：写法有两种：:title="`字符串${xx}`" 或 :title="'字符串' + xx" 都可以。其中，{}里面可以写js方法。如： {{ item.text }} 3、js中的字符串拼接： this.personList.forEach(item =>

{item.label = `${item.userName} (${item.account})`;}); this.$bus.$emit (`${this.activeName}-reload`, this.searchData); switchStatus (row) {this.$Modal.confirm ({title: 'prompt', content:` confirm that the switching status is ${row.isDelete = 1? 'No': 'yes'}? `, onOk: () = > {row.isDelete = row.isDelete = 0? 1: 0;}});}, "how to implement the stitching function of multiple field values in VUE + Element" ends here. Thank you for reading. If you want to know more about the industry, you can follow the website, the editor will output more high-quality practical articles for you!