vue getter를 사용하여 개체 내부의 값을 찾는 방법은 무엇입니까?

vue getter를 사용하여 개체 내부의 값을 찾는 방법은 무엇입니까?

vuex 상태 내에서 개체의 특정 값을 가져오고 싶습니다.

무슨 뜻인지 보여드리죠.

import { createStore } from "vuex";

export default createStore({
    state: {
        cards: [{
                title: "Blog 1",
                htmlCode: "This is blog 1",
                index: 1,
            },
            {
                title: "Blog 2",
                htmlCode: "This is blog 2",
                index: 2,
            },
            {
                title: "Blog 3",
                htmlCode: "This is blog 3",
                index: 3,
            },
            {
                title: "Blog 4",
                htmlCode: "This is blog 4",
                index: 4,
            },
            {
                title: "Blog 5",
                htmlCode: "This is blog 5",
                index: 5,
            },
            {
                title: "Blog 6",
                htmlCode: "This is blog 6",
                index: 6,
            },
            {
                title: "Blog 7",
                htmlCode: "This is blog 7",
                index: 7,
            },
        ],
    },
    getters: {
      getTodoById: (state) => (id) => {
        return state.cards.find(todo => todo.index === id)
      }
    },
    mutations: {},
    actions: {},
    modules: {},
});

이 값을 코드에 삽입하면 다음과 같이 됩니다.<p>{{ this.$store.getters.getTodoById(2) }}</p>그 결과 다음과 같이 됩니다.{ "title": "Blog 2", "htmlCode": "This is blog 2", "index": 2 }내가 원하는 것은 예를 들면,htmlCode그리고 그 결과는This is blog 2.

누군가 내 말뜻을 이해해주길 바란다.

알기 쉽게 하기 위해:브라우저에 다음 결과를 표시합니다. 여기는 블로그 2입니다.

vuex getters를 사용하는 것은 제 웹사이트에서 매우 중요합니다.

이것은 긍정적인 해결책이다.

getTodoById: (state) => (id) => {
  const todo = state.cards.find(todo => todo.index === id)
  return todo.htmlCode
}

또 다른 해결방법은todo컴포넌트 내의 데이터 및created()이 데이터에 getter와 asign을 클릭합니다.

  data() {
    return {
      todo: null,
    };
  },
  created() {
    this.todo = this.$store.getters.getTodoById(id) // for example extracted by the route
  },

<p>{{ todo.htmlCode }}</p>

이거면 될 거야.

<p>{{ this.$store.getters.getTodoById(2).htmlCode}}</p>

언급URL : https://stackoverflow.com/questions/70199322/how-to-use-vue-getters-to-find-a-value-inside-an-object