码迷,mamicode.com
首页 > Web开发 > 详细

Vue.js(12)- 霸道的render函数渲染组件

时间:2018-11-16 15:10:27      阅读:160      评论:0      收藏:0      [点我收藏+]

标签:image   nbsp   vue.js   htm   app   pre   组件   import   code   

index.html

  <div id="app">
    <p>这是index.html</p>
  </div>

index.js

// 导入全的vue
// import Vue from ‘vue/dist/vue.js‘
// 导入阉割版的vue
import Vue from ‘vue‘

import App from ‘./app.vue‘
const vm = new Vue({
  el: ‘#app‘,
  template: `<div>这是template模板页面</div>`,
  // render函数会把页面上原来的都覆盖掉,le和template都都没有意义了,此时可以使用阉割版的vue了
  // createElement 是vue传的形参
  // render: function(createElement) {
  //   return createElement(App)
  // }

  // 简化后的函数
  render: c => c(App)
})

app.vue

<template>
  <div id="app1111">
    <h1>这是render函数组件</h1>
  </div>
</template>

技术分享图片

 

Vue.js(12)- 霸道的render函数渲染组件

标签:image   nbsp   vue.js   htm   app   pre   组件   import   code   

原文地址:https://www.cnblogs.com/houfee/p/9968293.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!