bogdan_uman
@bogdan_uman
шлЫмазл неукЪ-поцЪ

Как кэшировать геттер с аргументами?

Использую геттер-функцию:

checkTodo: ( state ) => (id) => {
      console.log( 'checkTodo', id )
      return state.todos.find(todo => todo.id===id ).done
    }

Получается, что она пересчитывает свое значение каждый раз, когда в массиве меняется значение, например поменялось значение только для id = 1, вызов будет идти и для других значений, что видно в примере. Есть ли какой-то вариант кэширования?

Вот что в документации написано:

Как и вычисляемые свойства, результаты геттера кэшируются, основываясь на своих зависимостях и будут пересчитаны только тогда, когда изменится одна из его зависимостей.


Пример

https://codepen.io/anon/pen/wypmjV?editors=1111

import Vuex from 'vuex'
import { mapGetters, mapMutations } from 'vuex'

Vue.use(Vuex);

const store = new Vuex.Store({
  state: {
    todos: [
      { id: 1, text: 'First', done: true },
      { id: 2, text: 'Second', done: false },
      { id: 3, text: 'Thirh', done: false }
    ]
  },
  getters: {
    allTodos( state ) { return state.todos },
    checkTodo1( state ) {
      console.log( 'checkTodo  1' )
      return state.todos.find(todo => todo.id===1).done
    },
    checkTodo: ( state ) => (id) => {
      console.log( 'checkTodo', id )
      return state.todos.find(todo => todo.id===id ).done
    }
  },
  mutations: {
    toggleDone( state, id ) {
      const todo = state.todos.find(el => el.id === id );
      todo.done = !todo.done;
    }
  }
})

new Vue({
  el: '#app',
  store,
  template: `
    <ul>
      <li v-for='todo in allTodos'>
      {{ checkTodo(todo.id) }}
        <button @click='toggleDone(todo.id)'>
          {{todo.text}}
        </button>
      </li>
      <li> {{checkTodo1 }}</li>
    </ul>`,
  computed: {
   ... mapGetters(['allTodos', 'checkTodo', 'checkTodo1'])
  },
  methods: {
    ...mapMutations(['toggleDone'])
  }
})
  • Вопрос задан
  • 333 просмотра
Пригласить эксперта
Ответы на вопрос 1
Alex_Wells
@Alex_Wells
PHP/Kotlin
Меняется state.todos, так что вполне логично, что все сеттеры обновляются. Это правильно.

Метода кэширования для таких случаев, скорее всего, не существует, да и не нужно особо)
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы