素材牛VIP会员
.vue组件 如何想store里面传值?
 su***an  分类:JavaScript  人气:1093  回帖:3  发布于6年前 收藏

.vue

export default {
    data(){
        return{
            // useID:api.hdCookie.getCookie('userID')
        }
    },
    computed:{
        proList(){
            return this.$store.getters.getPageList
        },
        useID(){
            return api.hdCookie.getCookie('userID')
        },
        page(){
            return 1
        },
        num(){
            return 8
        }
    },
    mounted(){
        this.$store.dispatch('fetchPageList');
        console.log(this.$store);
    },
    methods:{

    }
}

store

import Vue from 'vue'

const state = {
  pageList: [],
  pageIndex: undefined,
  pageNum: 10
}
const getters = {
  getPageList: state => state.pageList,
  getPageIndex: state => state.pageIndex,
  getPageNum: state => state.pageNum
}
const actions = {
  fetchPageList({ commit, state }) {
    Vue.http.get('https://xxx?userId=' + useID + '&pageIndex=' + page + '&pageNum=' + '10')
      .then((res) => {
        commit('changePageList', JSON.parse(res.data.content).projectList)
      }, (err) => {

      })
  }
}
const mutations = {
  changePageList(state, payload) {
    state.pageList = payload
  },
  updateParams(state, { key, val }) {
    state.params[key] = val
  }
}

export default {
  state,
  getters,
  actions,
  mutations
}

如上,.vue组件需要向store里面传值,需要把useID,page,num传进来,动态修改http url的参数值?

 标签:vue.jsjavascript

讨论这个帖子(3)垃圾回帖将一律封号处理……

Lv5 码农
36***2q Linux系统工程师 6年前#1
this.$store.dispatch('fetchPageList',{key1:v1,key2:v2});
Lv6 码匠
訫***3 移动开发工程师 6年前#2

直接设置通过mutation,若需要异步获取用action

Lv6 码匠
qx***23 Linux系统工程师 6年前#3
this.$store.dispatch('incrementAsync', {
  useID: 10,
  page: 1
})


const actions = {
  fetchPageList({ commit, state }, data) {
  let {useID, page} = data
    Vue.http.get('https://xxx?userId=' + useID + '&pageIndex=' + page + '&pageNum=' + '10')
      .then((res) => {
        commit('changePageList', JSON.parse(res.data.content).projectList)
      }, (err) => {

      })
  }
}
 文明上网,理性发言!   😉 阿里云幸运券,戳我领取