is it not true that the data of the parent component will be affected when the child component of the computing property is changed without the use of the parent-child communication? Why is this child component + 1 and the parent component is still 10? Or is the example I wrote wrong?
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
</style>
<script src="vue.js"></script>
<script type="text/javascript">
window.onload=function(){
var user={
template:"-sharpmy_div",
props:["message"],
methods:{
add(){
this.messagePP;
this.$emit("increment1");
}
}
}
new Vue({
el:"-sharpapp",
data:{
test:10
},
components:{
"user":user
},
methods:{
incrementTotal: function () {
alert(this.test);
}
}
})
}
</script>
</head>
<body>
<template id="my_div">
<div>
<h3>{{message}}</h3>
<button @click=add()></button>
</div>
</template>
<div id="app">
<user :message="test" v-on:increment1="incrementTotal"></user>
</div>
</body>
</html>