导入vue.js组件

Question

我需要导入组件与数据到vue.js应用程序。

我可以注册组件，我使用了这段代码。

正确代码：

  export default {
    name: 'hello',
    data () {
      return {
        msg: 'Welcome to Your Vue.js App'
      }
    },
    components: {
      'test': {
        template: '<div>msg: {{message}}</div>',
        props: {
          message: {
            type: String,
            required: true
          }
        }
      }
    }
  }

但是如何使用数据在本地注册呢？

不正确：

import Test from './components/Test.vue';

export default {
    name: 'hello',
    data () {
      return {
        msg: 'Welcome to Your Vue.js App'
      }
    },
    components: {
      'test': {
        template: Test,
        props: {
          message: {
            type: String,
            required: true
          }
        }
      }
    }
  }

Answer 1

这应该能行

import Test from './components/Test.vue';

export default {
    name: 'hello',
    data () {
      return {
        msg: 'Welcome to Your Vue.js App'
      }
    },
    components: {
      Test
    }
  }

如果你想通过道具

<template>
<Test :message=msg></Test>
</template>

Answer 2

我在组件代码(components/xxx.vue)中使用props并对其进行了解析。