programing

계산된 속성에 대한 '평가 중 오류'

kingscode 2022. 7. 14. 21:59
반응형

계산된 속성에 대한 '평가 중 오류'

계산된 속성이 가끔만 작동하는 문제가 있습니다.값/오류가 있을 수 있습니다.templateComponent:"(error during evaluation)"

이 문제의 원인은 무엇입니까?만약 누군가가 나를 올바른 방향으로 인도해 준다면 나는 더 자세히 조사할 수 있지만 어디서부터 시작해야 할지 모르겠다.

문제 계산 속성:

// Error in the below computed property
templateComponent() {
  let template = 'default' // assign default template

  if (!_.isNull(this.wp.template) && this.wp.template.length)
    template = this.wp.template.replace('.php','').toLowerCase()

  return template
}

Page.vue

<template>
    <div v-if="wp">
      <component :is="templateComponent" v-bind:wp="wp"></component>
    </div>
    <p v-else>Loading...</p>
</template>

<script type="text/javascript">

import { mapGetters } from 'vuex'
import * as Templates from './templates'

// Map template components
let templateCmps = {}
_.each(Templates, cmp => {
    templateCmps[cmp.name] = cmp
})

export default {

  props: ["slug"],

  components: {
    ...templateCmps

    // Example of templateCmps is below
    // 'default': Templates.Default,
    // 'agency': Templates.Agency,
    // 'home': Templates.Home,
  },

  computed: {
    ...mapGetters(['pageBySlug']),

    wp() {
      return this.pageBySlug(this.slug);
    },

    // Error in the below computed property
    templateComponent() {
      let template = 'default' // assign default template

      if (!_.isNull(this.wp.template) && this.wp.template.length)
        template = this.wp.template.replace('.php','').toLowerCase()

      return template
    }
  },

  created() {
    // Get page title, content, etc. via rest request
    this.$store.dispatch('getPageBySlug', { slug: this.slug })
  }
}
</script>

이 문제는 다음과 관련이 있을 수 있습니다.this.wp.template항상 lower Case를 호출할 수 있는 문자열이 맞습니까?계산된 속성이 문자열이 아닌 다른 것을 반환하는 경우 문제가 발생할 수 있습니다.

또한 Vue는 숫자 에 대시를 처리하는 데 문제가 있습니다.

**> must be added:
> --> import store from "./store/store";
> --> new Vue({ .... store ....**


import store from "./store/store";

Vue.config.productionTip = false;

new Vue({
  router,
  store,
  render: (h) => h(App),
}).$mount("#app");

언급URL : https://stackoverflow.com/questions/50016501/error-during-evaluation-for-computed-property

반응형