vue前端data传给action
2017-03-17 22:21
106 查看
1.vue-view
2.vue-data
3.vue-method
4.vuex-action
<el-input v-model="u.name" placeholder="请输入用户名"></el-input> <el-input v-model="u.pwd" placeholder="请输入密码"></el-input> <button @click='login'>登录</button>
2.vue-data
export default { name:'login', data:() =>({ u:{name: 'abc',pwd:'123'} }), //箭头函数返回对象时,需要将对象包裹在小括号里 }
3.vue-method
methods:{ login() {this.$store.dispatch('fun',this.u)}, //调用action中的方法 }
4.vuex-action
export const fun = ({ commit,state },u) => { //action只能接受两个参数 alert(u.name+","+u.pwd) }
相关文章推荐
- Intent中的四个重要属性——Action、Data、Category、Extras
- spring boot + vue + element-ui全栈开发入门——前端列表页面开发
- vue 中自定义指令改变data中的值
- 前端使用FormData实现上传文件(上传头像实例)
- EasyDSS高性能流媒体服务器前端重构(三): webpack + vue + AdminLTE 多页面引入 element-ui
- 高性能流媒体服务器EasyDSS前端重构(一)-从零开始搭建 webpack + vue + AdminLTE 多页面脚手架
- Windows环境搭建VUE前端开发环境-项目新建与调试
- Ligerui之grid表格的dataAction的local和server的区别
- 前后端分离的j2ee的web项目,使用vue方式,即{{}}方式批量传入前端参数,遇到一个一个问题,页面上一开始有{{}},怎么处理?
- 前端验证用户登陆状态(vue.js)
- vue+axios 前端实现登录拦截(路由拦截、http拦截)
- 前端开发之走进Vue.js
- 【VUE】基于VUE的IVIEW前端框架共享
- vue2.0基于vue-cli,element-ui饿了么vue前端开源项目制作vue的树形table,treeTable
- Intent中的四个重要属性——Action、Data、Category、Extras
- 用 Vue 做一个酷炫的 menu:15篇前端热文回看
- 【vue+axios】前端实现登录拦截
- 编码为multipart/form-data自定义类型(包括文件)如何自动绑定到webapi的action的参数里
- 发现Vue.js做前端交互不错,非常轻量级
- Bitmap & BitmapData classes in Actionscript 3.0