自存 vue cli 使用props没有传值成功

最新推荐文章于 2023-11-06 16:27:05 发布

weixin_48419976

最新推荐文章于 2023-11-06 16:27:05 发布

阅读量133

点赞数

文章标签： vue.js Powered by 金山文档

本文链接：https://blog.csdn.net/weixin_48419976/article/details/128965486

版权

在使用 Vue CLI 创建的项目中，遇到在自定义组件中通过 props 传递值的问题。当在 Vuetify 的组件演示上尝试 props 传值时，发现值无法正确传入子组件，页面显示为空。排除问题后，通过简化代码，删除所有 Vuetify 组件，仅保留基础结构，成功实现了 props 的传值。关键步骤包括：定义组件名称，从模块导入组件，通过 components 属性注册组件，并在父组件模板中直接使用标签并传入值。

摘要由CSDN通过智能技术生成

原先是用在自己vuetify demo上用的props 传值

在

规定好 source(自取名)子组件规定好propS规则后

<template>
<div>===={
   { title }}---</div>


</template>

<script>
  export default {
    name: 'HelloWorld',
    props:['title']
  }
</script>
//这是子组件

在父组件引入后并没有把值传进子组件

在页面白茫茫显示

把以前的vuetify所有组件删除一切最简就传值成功

<template>
    <v-app id="inspire">
       <HelloWorld title="租房子啊 "></HelloWorld>
    </v-app>
</template>

<script>
import HelloWorld from './components/HelloWorld.vue';
    export default {

        components:{H