trenki的博客

1.直接store中dispatchexport default { methods: { clickFn() { this.$store.dispatch("sampleFn") //不带参 this.$store.dispatch("withParamFn",param) //带参,param为参数 } }};2.使用mapActions取值import { mapActions } from "vuex";export default {

getter取值与state取值具有相似性1.直接从根实例获取// main.js中，把store注册在根实例下，可使用this.$stroe.getters直接取值computed: { testNum1() { return this.$store.getters.testNum1; }}2.使用mapState取值import { mapGetters } from "vuex";export default { computed: { ...mapGet

1.直接从store实例取值// main.js中，把store注册在根实例下，可使用this.$stroe.state直接取值export default { computed: { testNum() { return this.$store.state.testNum; } }};2.使用mapState取值的多种方法import { mapState } from "vuex";export default { data() { ret

组件化是Vue的精髓，Vue应用就是由一个个组件构成的。1.定义组件是可复用的 Vue 实例，准确讲它们是VueComponent的实例，继承自Vue。2.优点可以增加代码的复用性、可维护性和可测试性。提高开发效率， 方便重复使用，简化调试步骤，提升整个项目的可维护性，便于协同开发，是高内聚、低耦合代码的实践。3.使用场景通用组件：实现最基本的功能，具有通用性和复用性。例如按钮组件、...

当时发生问题时vue的版本是2.5.17，发现input框没有绑定composition事件，后来将vue升级到2.6.10就解决了。主要是查看一下input框有没有绑定compositionend和compositionstart事件CompositionEventCompositionEvent触发的时候就是在文本合成系统，换句话说就是在使用输入法输入中文的时候会触发它的三个事件（com...

用v-model实现数据的双向绑定，主要用于父子组件中，其中可作用于表单元素，如input、textarea、select。1.v-model实现原理v-model其实是语法糖，把背后两个操作合并为一个指令 <input type="text" v-model="value"> <!-- 等同于 --> <input type="text" :value="...

父组件使用 .sync 修饰符<template> <div class="Home"> <v-model :text.sync='text' ></v-model> <div>{{text}}</div> </div></template>子组件利用 this.$emi...