render在组件中的应用

——–html——–

<div id="app">
    <heading :level="selected">Hello world!</heading>
    <select v-model="selected">
        <option value="1">h1</option>
        <option value="2">h2</option>
        <option value="3">h3</option>
        <option value="4">h4</option>
        <option value="5">h5</option>
        <option value="6">h6</option>
    </select>
</div>

——–js——–

new Vue({
  el: '#app',
  data(){
        return{
            selected:"1"  //默认选择
        }
    },  
  components:{'heading':{
            render:function(h){   //这里 render 就相当于template
                return h("h"+this.level,"content")  //参数1标签，参数2内容
            },
            props:{
                level:{
                    type:String,
                    required:true
                }
            }
        }
    }
})