标签:换包 vue legends server json 图例 static 数据
前端写页面的时候,对于一些标题,副标题等,都是直接写死,因为一般情况都不会有什么变化,如果有一些规则描述需要修改的,可能也就代码修改后,重新发布,
有些麻烦,为了避免每次都需要代码中修改,直接将这些变动频繁的数据放到json中,前端获取json中的数据进行赋值,这样就可以通过维护json直接更新修改了。
步骤:
- 在static文件夹中创建一个.json 文件
将经常变动的数据定义成变量,键值对,放置在此文件中
如:
{
"dev": "http://xxxx:80",
"legends": {
"desc":"abcxxxxxxxxx",
}
}
- 在static文件夹同级目录中创建一个js文件
文件请求获取数据,将数据暴露出去
var legends = ""; //定义服务端接口访问数据
$.ajax({
//添加版本号,避免后期系统运行浏览器报304读取历史数据,无法每次获取最新数据
url: `./static/utils/server.json?timestamp=${new Date().getTime()}`,
async: false,
dataType: "json",
cache:false,
success: (server)=> {
if (!legends) legends = server.legends ? server.legends : {}
//未获取到图例数据异常处理
if (!legends) {
alert("图例配置错误,请检查")
}
},
error: function (xhr) {
alert("图例文件访问错误: " + xhr.status + " " + xhr.statusText);
}
});
export default legends;
3.在需要使用的页面中引入,然后就可以愉快的使用了!
import legends from "../../../lengends";
标签:换包,vue,legends,server,json,图例,static,数据 来源: https://www.cnblogs.com/jocelyn11/p/15905750.html
本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享; 2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关; 3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关; 4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除; 5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。