2019-07-15vue项目基础篇 2019-07-15vue项目基础篇

vue项目总结
创建vue环境：https://blog.csdn.net/u013182762/article/details/53021374
引入jq：https://blog.csdn.net/u011025329/article/details/71721319
额外依赖包引入：cnpm install vuex(依赖包名) --save-dev,所有额外依赖包使用都需要在main.js中引入（import Vuex from 'vuex'）
vue生命周期详解：https://segmentfault.com/a/1190000011381906
工具使用：vuex，axios
UI使用：elementUI
信息传递：query传（this.$router.push({path:"/sds",query:{VISITPLANITEMS_ID:VISITPLANITEMS_ID,STATUS:STATUS }})），接（this.$route.query.VISITPLANITEMS_ID; ）
路由跳转：this.$router.push({path:"/indexPage"});
vue项目打包：npm run build,同时修改配置文件index.js的build节点，与router（路由）的配置信息 mode:"history",base:"/hospital/app/（服务器根目录下路径）",
vuex使用：export default new Vuex.Store({
state: {
PATIENTNAME:"",
CASENO:"",
ipConfig:"http://192.168.1.1:8080/",
BZM:"",

},
mutations: {
postInformation (state,obj) {
state.PATIENTNAME=obj.PATIENTNAME;
state.CASENO=obj.CASENO;
state.BZM=obj.BZM;

}
},
actions: {
increment (context) {
context.commit('increment')
}
}
})
vuex接收：this.$store.state.ipConfig;
vuex写入：this.$store.commit('postInformation',{
PATIENTNAME:res.data.varList[0].PATIENTNAME,
CASENO:res.data.varList[0].CASENO,
BZM:res.data.varList[0].BZM,
})
axios使用（先引入案axios,依赖会造成this重定向，需提前记录this指向，本次使用的是_that=this记录this指向）：
POST方法 ==== axios.post(ip + "hospital/app/updateAll", {
【2019-07-15vue项目基础篇】 ids: ids,
scores: scores,
APPRAISER: _that.answer,
TOTALSCORE: _that.sum,
visitPlanItemsID: visitPlanItemsID（请求参数）
}).then(function(res) {
回调方法
_that.$message({
type: 'success',
message: '保存成功!'
});
}).catch(function(err) {
_that.$message('请返回上一页，重新进入');
})
GET方法 === = axios.get(ip + "hospital/app/list", {
params: {
visitPlanItemsID: questionnaire_id
}
}).then(function(res) {
if(res.data != '') {
console.log(res);
}
}).catch(function(err) {
console.log(err);
_that.$message('请返回上一页，重新进入');
})
使用过程中总结：避开传统jq思维，转化为vue思想，利用vue原始方式进行问题解决，善于使用钩子函数
在vue使用过程中，对于图片处理以import方式导入或其它处理方式（需继续研究）
v-model数据绑定，对于select绑定方式绑定的是option节点
优点:优化代码量,便于协同开发,使用方便
缺点:遇到bug时调试不太方便
-----------------------待补充

2019-07-15vue项目基础篇

推荐阅读

高铁能带打火机吗

子宫肌瘤症状女人脸上长出它当心子宫不保

小苏打洗鞋是泡还是刷

荣耀10怎样开后盖

煮熟桃子可以存放多久熟桃子如何保存时间长

签了三方协议没去什么后果

珠海口岸有几个关口珠海口岸有几个？

保定住房公积金怎么提取出来？

马头琴是哪个民族的乐器

鲁大师卸载不了怎么处理

第九大陆职业包括哪些

做短视频用什么软件最好,不同类型等你来选

pdf文件

青汁喝多了有什么副作用

用通俗易懂的故事解读疾病_一辈子你都不会得大病_不信你就看看这几个故事！

Verizon狂裁44000名老员工（中年人，愿您的能力和年龄一起增长）

自动挡车换挡拨片有什么作用换挡拨片对自动挡有用吗

mysql集群版需要几台服务器 mysql服务器群集

昭平银杉茶怎么样

全面战争战锤2伊姆瑞克怎么破局全面战争战锤2伊姆瑞克破局