五、绑定value到Vue实例的一个动态属性上
对于单选按钮，勾选框及选择框选项，v-model绑定的value通常是静态字符串（对于勾选框是逻辑值）：
<!-- `toggle` 为 true 或 false -->
<input type="checkbox" v-model="toggle">但是有时候想绑定value到vue实例的一个动态属性上，这时可以用v-bind实现，并且这个属性的值可以不是字符串。例如绑定Checkbox的value到vue实例的一个动态属性：
<input
type="checkbox"
v-model="toggle"
v-bind:true-value="a"
v-bind:false-value="b">
<p>{{toggle}}</p>这里绑定后，并不是说就可以点击后由true,false的切换变为a,b的切换，因为这里定义的动态a，b是scope上的a,b，并不能直接显示出来，此时
//当选中时
vm.toggle === vm.a
//当没选中时
vm.toggle === vm.b所以此时需要在data中定义a,b，即：
new Vue({
el:'...',
data:{
a:'a',
b:'b'
}
});六、片段实例
下面几种情况会让实例变成一个片断实例：
模板包含多个顶级元素。
模板只包含普通文本。
模板只包含其它组件（其它组件可能是一个片段实例）。
模板只包含一个元素指令，如
<partial> 或 vue-router 的
<router-view> 。模板根节点有一个流程控制指令，如
v-if 或
v-for。这些情况让实例有未知数量的顶级元素，它将把它的 DOM 内容当作片断。片断实例仍然会正确地渲染内容。不过，它没有一个根节点，它的$el 指向一个锚节点，即一个空的文本节点（在开发模式下是一个注释节点）。
但是更重要的是，组件元素上的非流程控制指令，非 prop 特性和过渡将被忽略，因为没有根元素供绑定：
<!-- 不可以，因为没有根元素 -->
<example v-show="ok" transition="fade"></example><!-- props 可以 -->
<example :prop="someData"></example>
<!-- 流程控制可以，但是不能有过渡 -->
<example v-if="ok"></example>
片段实例也有用处，但是通常情况下组件有一个根节点比较好，它会保证组件元素上的指令和特性能正确的转换，同时性能也稍微好些。
七、路由嵌套
路由嵌套会将其他组件渲染到该组件内，而不是进行整个页面跳转router-view本身就是将组件渲染到该位置，想要进行页面跳转，就要将页面渲染到根组件，在起始配置路由时候写到：
