gpt4 book ai didi

javascript - Vue 组件未使用 props 渲染

转载 作者:行者123 更新时间:2023-12-01 16:17:31 25 4
gpt4 key购买 nike

<分区>

我是 Vue 初学者。我创建了一个自定义组件,并尝试完全按照 starter Vue cli 模板中所示的方式绑定(bind)所有内容。这是代码。

Circle.vue

<template>
<div :style="custom">
</div>
</template>

<script>
export default {
name:'Circle',
props:{
size:String,
color:String
},
computed:{
custom(){
return {
background:this.color,
height:this.size,
width:this.size
}
}
}
}
</script>

在我的 View.vue 文件中

<script>
// :class="['']"
import Circle from '@/components/Circle.vue'
export default {
name: "Landing",
components:{
Circle
}
};
</script>

我试过这样用

<Circle size="100px" color="#222222"/>

我尝试按原样打印 Prop ,但它也不起作用

<template>
<div :style="custom">
{{size}} {{color}}
</div>
</template>

执行此操作后屏幕上没有显示任何内容。我从 here 得到了帮助

感谢您的宝贵时间!

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com