<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="">
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
</head>
<body>
<template id='cpn'>
<div>
<h4 v-html="cmessage"></h4>
<ul>
<li v-for="item in cmovies">
{{item}}
</li>
</ul>
</div>are bound to which variable values which received variable ->//
<-!
<div ID = 'App'>
</ Template>
<CPN: cmovies = 'Movies'> </ CPN>
</ div>
<Script> // subassembly
const CPN = {
// external template
Template: '#cpn' ,
// declare a variable to receive the parent element by value the props: {
cmovies: {
type: the Array, default () {
return {
}
}
},
cMessage: {
type: String, default : 'I is the mass value of the parent component'
}
}
}
Const VM = new new Vue ({
EL: '#app' ,
Data: {
Message: '!! Watch movies ah <br/> here is my parent component brought from the movie data' ,
Movies: [ 'Zha ',' spirited away ',' A dream ',' Spider ' ]
},
// registration subassembly
components: {
CPN
}
})
</ Script>
</ body>
</ HTML>
