前端模拟面试练习提升题

1、在store文件下面新建文件 print.js ，写入以下代码

    /**

     *  存放 ** 数据

     * **/

    

    // initial state

    const state = {

        all: { 

            ID:'',

            BrandID:''

        }

    }

    

    // getters

    const getters = {}

    

    // actions

    const actions = {}

    

    // mutations

    const mutations = {

        setPrint(state, all) { //设置参数

          //  这里的写法有两种，可以根据自己喜欢选择

           // 第一种

            state.all = all;

            

   // 第二种

state.all.ID = (all.ID == '' || all.ID) ? all.ID : state.all.ID;

state.all.BrandID = (all.BrandID == '' || all.BrandID) ? all.BrandID : state.all.BrandID;


        }

    }

    

    export default {

        namespaced: true,

        state,

        getters,

        actions,

        mutations

    }
注意：记得在store下面的index.js文件中引入这个文件
 
    import Vue from 'vue';
import Vuex from 'vuex';
import print from './module/print';
const debug = process.env.NODE_ENV !== 'production';
Vue.use(Vuex);
    export default new Vuex.Store({
    modules: {
            print
    },
    strict: debug,  //开启严格模式
        plugins: debug ? [createLogger()] : []
    })
 
 
2、将数据存入vuex中（在要存入数据的页面写）
    this.$store.commit("print/setPrint", {  //print 表示vuex的文件名
       ID: this.ID,
       BrandID: 402
    });
 
3、将数据从vuex中取出来使用（在要使用的页面写）
    import { mapState, mapActions } from "vuex";
    computed: {
        ...mapState({
             print:state=>state.print.all
        })
      }
 
在用到的地方直接写入以下代码即可：
 
    this.CreateID = this.print.ID;
    this.GoodsID = this.print.BrandID;

--------------------------------------------------------

智一面|前端面试必备练习题