vue中异步数据处理策略

封装ajax: 

        promise+axios封装ajax请求的函数

        封装每个接口对应的请求函数(能根据接口定义ajax请求函数)

        解决ajax的跨越域问题: 配置代理, 对代理的理解

    vuex编码

        创建所有相关的模块: store/index|state|mutations|actions|getters|mutation-types

        设计state: 从后台获取的数据

        实现actions: 

            定义异步action: async/await

            流程: 发ajax获取数据, commit给mutation

        实现mutations: 给状态赋值

        实现index: 创建store对象

        main.js: 配置store

    组件异步显示数据

        在mounted()通过$store.dispatch('actionName')来异步获取后台数据到state中

        mapState(['xxx'])读取state中数据到组件中

        在模板中显示xxx的数据

    模板中显示数据的来源

        data: 自身的数据(内部改变)

        props: 外部传入的数据(外部改变)

        computed: 根据data/props/别的compute/state/getters

    异步显示轮播图

        通过vuex获取foodCategorys数组(发请求, 读取)

        对数据进行整合计算(一维变为特定的二维数组)

        使用Swiper显示轮播, 如何在界面更新之后创建Swiper对象?

            1). 使用回调+$nextTick()

            2). 使用watch+$nextTick() 

你可能感兴趣的:(vue,vue)