使用Uniapp随手记录知识点

使用uniapp随手记录知识点

• [1 组件](#1 组件)
• • 内置组件
  • 扩展组件
• [2 vuex状态管理](#2 vuex状态管理)
• • 使用流程
  • [mapState 辅助函数](#mapState 辅助函数)
  • getters

1 组件

内置组件

内置组件内主要包含一些基础的view button video scroll-view等内置基础组件，满足基础场景

扩展组件

扩展组件是uniapp封装了一些成品的组件，可以帮助开发者快速构建一些功能，节省时间。例如：日期选择小组件等

2 vuex状态管理

使用流程

1. 创建vuex js
2. 引入store存储
3. 使用计算属性 获取状态机当中的值

mapState 辅助函数

当一个组件需要获取多个状态的时候，都声明成计算函数会有些重复和冗余。为了解决这个问题，我们可以使用mapState 辅助函数帮助我们生成计算属性。

1. 第一种 在计算属性中使用mapState构建一个对象形式的映射

    	computed: mapState({
    		username: state => state.username,
    		age: state => state.age
    	})

2. 第二种 如果状态机中的属性和vue组件中的属性名一致的情况下，也可以使用数组

    computed: mapState(['username','age'])

getters

getters 定义获取状态机中数据的辅助函数

访问方式

• 导入store
  通过 store.getters.xxx 即可访问该函数
• 直接通过this.$store.getters.xxx 就可以访问getters提供的函数