官方教程:https://pro.antdv.com/docs/new-component
第一步:新增组件文件
在components下新建文件夹,在文件夹下新建Test.vue
<template>
<div>测试参数传输{{ data }}</div>
</template>
<script>
export default {
name: 'Test',
props: {
data: {
type: String,
default: null
}
},
data () {
return {}
},
methods: {}
}
</script>
<style scoped>
</style>
在文件夹下新建index.js
import Test from './Test.vue'
export default Tes
最后目录结构为
第二步(重点):修改components下的index.js
加入刚才新建的组件引用
第三步:使用
<template>
<Test :data="data"></Test>
</template>
<script>
import { Test } from '@/components'
export default {
name: 'Test',
components: { Test },
data () {
return {
data: 'tt'
}
}
}
</script>
<style scoped>
</style>