vue中把变量从.js文件中引入 |
您所在的位置：网站首页 › js文件引入另一个js文件的变量 › vue中把变量从.js文件中引入 |
vue中把变量从.js文件中引入
|
前言：在vue开发中，我们通常把数据定义在data（）里面。但是当此页的数据很多的时候，就会去定义很多个变量名，这样不仅不太美观，而且不利于模块化的开发。所以可以尝试着将这些变量放到一个.js文件里面，然后再在.vue文件里去使用就好啦！ 一、目录结构如下在assets下新建一个js文件夹，在components下新建一个index.vue文件 在index.vue中写入 {{zuopin}} {{content.name}} {{content.title}} {{item.name}}{{item.title}} import {box_Data} from "@/assets/js/indexdata"; import {box2_data} from "@/assets/js/indexdata"; export default{ name:'index', data(){ return{ zuopin:'作品集', info:box2_data, content:box_Data } }, }在index.js中写入 const box_Data = { name:`作者名称`, title:`作品名称`, } const box2_data = [ { id:`1`, name:`史铁生`, title:`《我与地坛》`, }, { id:`2`, name:`路遥`, title:`《平凡的世界》` } ] export { box_Data, box2_data } 三、步骤总结1、新建js文件，在其中定义变量，可以是对象可以是数组 2、导出const的变量名称 3、在.vue文件中导入 导出的变量名 4、在data里面进行赋值 5、在template中使用即可 |
【本文地址】
今日新闻 |
推荐新闻 |