本文示例了如何在Vue.js应用中，子组件通过props从父组件接收数据并显示。在HTML中定义了一个Vue实例，并创建了一个名为`com`的子组件，该组件通过`v-bind:parentmsg`接收来自父组件的`msg`属性。在JavaScript部分，子组件`com`定义了一个模板，其中`{{parentmsg}}`用于展示从父组件传递过来的值。最后，父组件的Vue实例绑定了`msg`数据并注册了子组件。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="https://unpkg.com/vue/dist/vue.min.js"></script>
</head>
<body>
<div id="app">
<com v-bind:parentmsg="msg"></com>
</div>
<template id="template">
<div>
<h1>子组件：{ {parentmsg}}</h1>
</div>
</template>
<script>
var com={
template:'#template',
props:['parentmsg']
最低0.47元/天 解锁文章
扫一扫
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
