render函数
render函数1.不同版本的Vue区别 2. render函数12345678910111213141516import Vue from 'vue'import App from './App.vue'Vue.config.productionTip = falsenew Vue({ el: '#app', // render函数功能:将App组件放入容器中 // 简写形式 render: h => h(App), // 完整形式 // render(createElement) { // return createElement(App) // }})
ref属性
ref属性是组件的一个属性,通过这个属性,可以拿到当前组件内的子组件
props配置项
props配置项 1.在父组件直接通过属性传递参数就行了2.子组件通过props配置项接收数据3.由于props这种外来的传递数据比内置的data优先级高,所以可以通过将外来数据传递到data中再进行显示.这是为了不报错
Object.defineProperty
Object.defineProperty1.这个东西实际上就是把一个对象与定义的一个数据进行绑定,实现动态变化 value:指的是person对象中的age属性的值 2.通过这个方法中的get和set方法实现数据绑定
mixin混入
mixin1.混入就是指共用一个配置项,并且这个配置项会整合目标的内容而不是替换.2.如果发生了冲突,那么以原本的数据为主3.如果是生病周期勾子发生了冲突,则整合 4.全局混入需要在main.js文件中引入并配置5.局部混入需要在相对应的组件中进行引入并配置
mapState和mapGetters
mapState和mapGetters就是一个代码生成方法 使用方法1.引入mapState和mapGetters12import { mapState } from 'vuex';import { mapGetters } from "vuex"; 2.在computed属性中调用mapState方法和mapGetters方法12345678910111213141516171819202122232425<script>import { mapState } from 'vuex';import { mapGetters } from "vuex"; export default { name: 'count', computed: { ...mapState(["sum", "school",...
mapActions和mapMutations
mapActions 和 mapMutations使用方法1.引入mapActions 和 mapMutations12import { mapMutations } from 'vuex';import {mapActions } from "vuex"; 2.在methods中调用mapActions和mapMutations方法1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950<template> <div> <h1>当前求和为:{{ this.$store.state.sum }}</h1> <!-- <h1>当前求和放大10倍为:{{ this.$store.state.sum *10...
key的作用与原理
key的作用与原 理 作用key作为数据的唯一标识,默认根据index. 原理diff对比算法
getters配置项
getters配置项getters配置项并不是必须要使用的,当state中的数据需要经过加工后再使用时,可以使用getters加工。 使用方法1.在store.js中追加getters配置1234567891011121314151617......// 准备getters——用于加工state中的数据const getters = { // state:真正的state calculate(state){ // 靠返回值决定自己的值 return state.sum * 10 }}//创建并暴露storeexport default new Vuex.Store({ ...... // 在store中配置getters getters}) 2.模板中读取数据123<!-- <h1>当前求和放大10倍为:{{ this.$store.state.sum *10 }}</h1>...
Function与Object
Function与Object:函数与对象