Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

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

2025-01-17 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)05/31 Report--

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!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report