Ошибка выброса динамического компонента vuejs для v-bind: is, error - это свойство или метод… не определен в экземпляре, но на него ссылаются во время рендеринга

1

Код в файле:

<template>
  <component v-bind:is="bbc"></component>
</template>

<script>

import bbc from './bbc.vue';

  export default {
    name: 'ShowRoom2',
  };
</script>

./bbc.vue

<script>
  export default {
    name: 'bbc',
    props: {
      msg: String,
    },
    mounted() {
      console.log('bbc is mounted');
    },
    render() {
      if (this.func) this.func();
      return (
        <div class="bbcMyClass">
          <h1>bbc: <span>Pal</span> <span>{this.msg}</span></h1>
        </div>
      )
    }
  };
</script>

Воспроизведение

  1. git clone [email protected]: adamchenwei/vue-hoc-playground.git
  2. перейти к src/components/ShowRoom2.vue
  3. пряжа установить && пряжа служить
  4. наблюдать за ошибкой в локальном браузере

Изображение 174551

  • 0
    я думаю , что вы должны установить is без :
  • 0
    @boussadjrabrahim извините, я могу неправильно понять, что вы сказали, но в документе сказано иначе (предоставлено, документ Vue не очень актуален для некоторых частей) vuejs.org/v2/guide/components-dynamic-async.html
Теги:
vue.js
vuejs2
components

1 ответ

2
Лучший ответ

Да, область действия в шаблоне не совпадает с областью действия сценария. Если вам нужны данные, вам нужно объявить их внутри части определения компонента. Для вашего случая, я думаю, свойство 'data' должно работать

import bbc from './bbc.vue';

export default {
  name: 'ShowRoom2',
  data() {
    return {
      bbc: bbc,
    };
  },
};

Тем не менее, шаблонная часть вашего кода также выглядит странно. Не могли бы вы объяснить, что вы пытаетесь сделать?

  • 0
    привет спасибо за ответ Я пытаюсь использовать динамический компонент в качестве альтернативы для создания HOC, который включает добавление имени класса и тому подобное в упакованный компонент, который, как я полагаю, может помочь <component> thingie? так что следующий шаг, который я собираюсь сделать, это <component class = "кое-что" data-кое-что = "кое-что" ...> <...>
  • 0
    HOC? Я не знаком с этим.
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню