python笔记(Vue 前后端分离小项目,Vuex:state,Mutation,actions)

ElenmentUI的使用
安装Elenment
引入Elenment
main.js

在这里插入图片描述

  1. 页面结构图
    在这里插入图片描述

  2. [生命周期]

    (https://cn.vuejs.org/v2/guide/instance.html#生命周期图示)

  3. 路由请求

    APP.vue
    在这里插入图片描述
    Vheader.vue
    在这里插入图片描述
    在这里插入图片描述
    切换路由
    在这里插入图片描述
    路由切换保持状态
    在这里插入图片描述

  4. Vuex

    main.js配置
    在这里插入图片描述

  5. vuex单独state的使用

    main.js 在这里插入图片描述
    APP.vue
    数据获取(自定义数据)
    在这里插入图片描述
    ajax请求数据
    在这里插入图片描述
    VnoteList.vue
    显示数据
    在这里插入图片描述
    VnoteItem.vue
    在这里插入图片描述
    Vmarked.vue
    提交数据
    在这里插入图片描述
    在这里插入图片描述
    获取值
    在这里插入图片描述
    提交到后端
    在这里插入图片描述

  6. mutation+state的使用

    main.js
    在这里插入图片描述

    获取数据在这里插入图片描述
    添加数据
    Vmark.vue
    在这里插入图片描述
    main.js
    在这里插入图片描述

  7. mutation+state+actions的使用(正规使用方法)
    Vmark.vue
    在这里插入图片描述

    main.js
    在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/qq_41433183/article/details/88958162