虚拟dom怎么理解？and prop验证

虚拟dom

1.在内存中生成一个虚拟dom树

2.初始化渲染成真实dom（浏览器可见）

3.修改数据

4.将修改后的数据结合之前的dom树，生成新的虚拟dom树

5.将新的虚拟dom树和之前的虚拟dom树进行diff算法对比出最小差异

6.再去将对比后的差异进行真实dom渲染

prop验证

props的值可以是对象，在里面可以对父组件传过来的数据做出验证，如果验证失败，会抛出警告

如果子组件没有通过props来接收父组件传递的某个数据，该属性就会出现在子组件模板的最外层节点上面（组件最外层的根元素上）

props内的type可以写数据类型的限定，default相当于默认值，required: true必传的意思

<div id="app">
    <father :msg="msg"></father>
</div>
<template id="father">
    <div>
        <p>这是father组件...{{msg}}</p>
    </div>
</template>
<script>
    new Vue({
        el:"#app",
        data:{
            msg:10
        },
        components:{
            father:{
                template:"#father",
                props:{
                    msg:{
                        type:Number,
                        default:1
                    }
                }
            }
        }
    })
</script>