v-for with 필터가 정의되지 않은 속성 또는 메서드의 오류를 발생함

v-for with 필터가 정의되지 않은 속성 또는 메서드의 오류를 발생함

Vue2를 Vuex와 함께 사용하고 있습니다.저는 https://jsonplaceholder.typicode.com/posts의 게시물 목록을 가지고 있으며, 그것을 내림차순으로 보여주고 싶습니다.이를 위해 main.js에 "desc"라는 이름의 필터를 만들어 컴포넌트 포스트에 적용했습니다.이렇게.

<li v-for="post in posts | desc" :key="post.id">

이게 내 메인이야.

import Vue from 'vue'
import App from './App'
import router from './router'
import { store } from './store/store'

Vue.config.productionTip = false

Vue.filter('desc', function(arr){
  if(arr) return arr.reverse();
});

new Vue({
  el: '#app',
  router,
  store,
  components: { App },
  template: '<App/>'
})

다음의 에러가 표시됩니다.

[Vue warn] :속성 또는 메서드 "desc"는 인스턴스에서 정의되지 않지만 렌더링 중에 참조됩니다.속성을 초기화하여 데이터 옵션 또는 클래스 기반 구성 요소에서 이 속성이 반응하는지 확인하십시오.https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties 를 참조해 주세요.

http get request가 응답과 함께 올 때까지 이 오류가 발생할 수 있다고 생각했습니다.이 문제를 해결하기 위해 정적 json 데이터로도 시도했지만 여전히 이 오류가 나타납니다.

누가 이 문제 푸는 것 좀 도와줄래?

v-for에서 slice().reverse()를 사용해 보십시오.

<li v-for="post in posts.slice().reverse()">
    //do something here
</li>

언급URL : https://stackoverflow.com/questions/55259011/v-for-with-filter-gives-error-of-property-or-method-not-defined