vuex

问题 I am using Vuejs with Webpack. Here's store.js: import Vuex from "vuex"; export default new Vuex.Store({ state: { count : 0 }, mutations: { increment (state) { state.count++ } } }); Here is my app.js: "use strict"; import Vue from 'vue'; window.Vue = Vue; import MyComponent from './MyComponent.vue'; import store from './store.js'; window.App = new Vue({ el : '#my-app', store, components : { 'my-component' : MyComponent } }); Here is the script from MyComponent.vue: export default { computed :

问题 I have some getters set up, you pass them an id and they return the relevent data. So i've mapped these into a component, however when passing a param the param is undefined. Component: <template> <div> <h1>{{ category.name }}</h1> </div> </template> <script> import { mapGetters } from 'vuex' export default { props: ['id'], computed: mapGetters({ subCategories: ['categories/getSubcategories'](this.id), category: ['categories/getCategory'](this.id) }) } </script> Getter: getCategory: (state,

问题 My view blade laravel like this : <form slot="search" class="navbar-search" action="{{url('search')}}"> <search-header-view></search-header-view> </form> The view blade laravel call vue component (search-header-view component) My vue component(search-header-view component) like this : <template> <div class="form-group"> <div class="input-group"> <input type="text" class="form-control" placeholder="Search" name="q" autofocus v-model="keyword" :value="keyword"> <span class="input-group-btn">

问题 I am using vuejs, vuex, and vuetify. There are 3 files involved I will post the important parts. Basically I want to display data corresponding to the route parameter. Whenever I use the following in my Product.vue <h1 class="heading primary--text"> {{ product.partNumber }}</h1> Nothing on that file loads, and when I check the console I get the following... Chrome: "TypeError: Cannot read property 'find' of undefined" Firefox: [Vue warn]: Error in render: "TypeError: state.loadedProducts is

问题 My view blade, you can see this below : ... <div class="panel-body"> <order-view v-cloak> <input slot="from-date" data-date-format="DD-MM-YYYY" title="DD-MM-YYYY" type="text" class="form-control" placeholder="Date" name="from_date" id="datetimepicker" required> <input slot="to-date" data-date-format="DD-MM-YYYY" title="DD-MM-YYYY" type="text" class="form-control" placeholder="Date" name="to_date" id="datetimepicker" required> </order-view> </div> ... My order-view component, you can see this

问题 I'm trying to split up my Nuxt Vuex store files into separate files . And NOT have all Vuex getters , mutations and actions into one huge file. This demo project is on Github by the way. I'v read this official Nuxt Vuex Store documentation; but can't seem to get it working. It's a bit vague on where to put stuff. I have the following in these files: Below is my: store/index.js import Vue from "vue"; import Vuex from "vuex"; import Auth from "./modules/auth"; Vue.use(Vuex); export const store

问题 I have a vue method that wants to commit data to a vuex mutation, for some reason I keep getting Uncaught TypeError: this.$store.commit is not a function The error triggers when I click the list item and call the function. sample.vue <li class="tabs-title" v-for="item in filteredItems" v-on:click="upComponents" :key="item.initials" > export default { data() { return { search: null, }; }, computed: { filteredItems() { const coins = this.$store.state.coin.coin; if (!this.search) return coins;

问题 I have an action within vuex that I would like to auto dispatch within vuex itself rather than a component. I have created a notification bar that changes through different notifications which is on multiple pages. Rather than the notifications start from the beginning when I switch page I have created a store to set which notification to show. I would like to dispatch the rotate function in the vuex store from within vuex rather than from within a component Please note: I'm using Nuxt VUEX

问题 This works just fine. created() { this['shared/getPosts'](); this['posts/getPosts'](); }, methods: { ...mapActions(['shared/getPosts', 'posts/getPosts']), }, But, I was wondering, is there a way to make below code work as expected, please refer comment: created() { this.getPosts(); // triggers last method }, methods: { ...mapActions('shared', ['getPosts']), // how to trigger this? ...mapActions('posts', ['getPosts']), // this gets triggered. }, 回答1: Just rename like so created() { // call the

问题 One can create a vuex store getter which takes a parameter argument as illustrated here: https://vuex.vuejs.org/en/getters.html I'm using Typescript (https://github.com/hmexx/vue_typescript_starter_kit) to write my code, but I can't figure out how to write a getter that takes a parameter argument. ie, the following does not seem to work: export function getItemById(state : State, id : Number) : MyItem | undefined { if(id === undefined) { return undefined; } for(const item of state.items) { if