- 博客(9)
- 收藏
- 关注
原创 Vuex 中mutations 属性的简单使用方法
Vue中利用Vuex中mutaions属性简单更改数据1.让state中的num值实现简单的 ++第一步在页面中渲染num数据 并添加一个简单的点击事件第二部在mutaions中定义一个方法 并写业务逻辑代码第三步在vue页面使用methods属性中使用 this.$store.commit()方法调用Vuex中定义的方法第四步运行文件 就能实现每次点击button按钮 就可以让num数据实现简单的+1效果如果想每次+2或者+5,+10....+100呢???可以在第二步中可以传入第
2022-06-28 14:09:43
696
2
原创 Vuex 中 state 属性的简单使用方法
1.页面读取下面state状态中数据的二种方式和三种表达式第一种:插值语法,直接调用$store.state.num的方式调用第二种:在computed计算属性中使用辅助函数mapstate() 第一步引入mapState第二步在计算属性中使用...mapState()方法接受数据 页面中插入方式:...
2022-06-28 13:46:41
703
原创 Vue v-on v-if v-else-if v-else 使用场景 以及修饰符
1.v-on 参数使用 <div id="app"> <button @click="btn">+</button> <!-- PointerEvent undefined --> <button @click="btn()">+</button> <!-- undefined undefined --> <button @click="b
2022-05-24 16:38:03
239
原创 计算属性与监听器 基本使用 方法
1.计算属性基本使用 <div id="app"> <h2>{{ firstName }}-{{ lastName }}</h2> <h2>{{ getFallName() }}</h2> <h2>{{ fullName }}</h2> <!-- 计算属性在页面渲染时 不需要加() --> </div> <scri
2022-05-23 19:03:16
160
原创 v-bind 的动态绑定语法
1.v-bind:class 动态绑定 class对象需要先绑定一个class对象{active: isActive} 任何名都可以在设置键 active 的一个style 属性,用 值 isActive 为 true 去渲染切换也就是取反 isActive <style> .active{ color: red; } </style></head><body>
2022-05-19 18:19:13
183
原创 Vue 简单指令 基本使用
1.v-bind 指令语法 <div id="app"> <span v-bind:title="messg">点我看看</span> <!-- <span :title="messg">点我看看</span> :title 语法糖 --> </div> <script src="vue.js"></script> <script&g
2022-05-19 15:49:16
125
原创 【无标题】
vue 简单写法<div id="app">{{masg}}</div> <script src="vue.js"></script> <script> const app = new Vue({ el:'#app', data(){ return{ ...
2022-05-18 16:58:55
192
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人