前言
父传子通过 属性绑定:
代码如下(示例):
css部分
<div id="app">
<!-- 父传子通过 属性绑定-->
<!-- 父组件-->
<!-- 静态值 -->
<!-- <com1 title="父传子值"></com1> -->
<!-- 动态值 -->
<com1 :title="parent_to_son"></com1>
</div>
js部分
$(function () {
const app = Vue.createApp({
data() {
return {
parent_to_son: "父传子值",
};
},
});
//子组件(类似于全局变量,可以设置多个)
app.component("com1", {
//子组件自己值
data() {
return {};
},
//子组件声明props
props: ["title"],
template: `<h1>这是子组件:{{title}}</h1>`,
});
const vm = app.mount("#app");
});