The following two ways of writing are essentially different:
<counter conut="0"></counter>
<counter :conut="0"></counter>
The parent component passes a value to the child component. If you don’t add a colon, what is passed is not a value, but a string. The
parent component passes a value to the child component. Add a colon, and what is passed is a value, not a string, because Added: the content inside the quotation mark "" after the colon is a js expression
Let's look at another example:
<body>
<div id="app">
<counter :count="0"></counter>
<counter :count="1"></counter>
</div>
<script>
var Counter = {
props: ['count'],
template: '<div>{
{count}}---typeof value: {
{typeof count}}</div>'
}
var vm = new Vue({
el: '#app',
data: {
},
components: {
Counter: Counter
}
});
</script>
</body>
When used :count="xxx":
Effect:
When used count="xxx":
Effect:
