vue异步axios如何实现获取数据渲染到页面-创新互联
小编给大家分享一下vue异步axios如何实现获取数据渲染到页面,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!
让客户满意是我们工作的目标,不断超越客户的期望值来自于我们对这个行业的热爱。我们立志把好的技术通过有效、简单的方式提供给客户,将通过不懈努力成为客户在信息化领域值得信任、有价值的长期合作伙伴,公司提供的服务项目有:域名注册、虚拟主机、营销软件、网站建设、黄岛网站维护、网站推广。index.vue
忽略坑人的传参方式。。。
created(){ this.init() this.axios.post('/wanwei/appserver/eqInfo/eqBaseInfo?reqjson={"eq_code":"BJTE1W03011SF001SBQDGPXTGYKG001"}').then((res) => { this.$nextTick(()=>{ this.$store.state.retData = res.data.retdata }) }) },
在创建时获取数据,将其存入store
加入页面只能这样写
equip.vue
- 设备惯用名 {{equipData.convent_eq}}
- 设备名称 {{equipData.eq_name}}
- 规格型号 {{equipData.modelno}}
- 采购价格 {{equipData.cost_purchase}}
规格信息
可以这样写,computed 属性,当equipData发生变化时,页面会自动渲染,如果数据没有获取到,默认它为空,这样就不会报错
computed:{ equipData:function () { return this.$store.state.retData.eqInfo||'' } },Vue的优点
Vue具体轻量级框架、简单易学、双向数据绑定、组件化、数据和结构的分离、虚拟DOM、运行速度快等优势,Vue中页面使用的是局部刷新,不用每次跳转页面都要请求所有数据和dom,可以大大提升访问速度和用户体验。
以上是“vue异步axios如何实现获取数据渲染到页面”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注创新互联行业资讯频道!
名称栏目:vue异步axios如何实现获取数据渲染到页面-创新互联
新闻来源:http://scyanting.com/article/ddigdj.html