Vuejs2.0学习之二(Render函数,createElement,vm.$slots,函数化组件,模板编译,JSX)

时隔一周多,因为一些别的事情绊住了,下面接着写。中间这段时间也有看官方文档,发现正如他所说90%的基础内容都一样,所以这里直接跳到我比较关注的东东上,要是想看看哪些不一样,可以参考这个http://vuefe.cn/guide/migration.html,表明了基础内容上发生了哪些变化。

直接来到进阶部分,过渡动画的过了一遍,大概讲述在dom发生变化时可以伴随的动画效果。不看了,后面用到再来看,更关注业务内容如何变化。

  1. Render函数
    所以直接来到Render,本来也想跳过,发现后面的路由貌似跟它还有点关联。先来看看Render
    1.1 官网一开始就看的挺懵的,不知道讲的是啥,动手试了一下,一开头讲的是Render的用法,官网的栗子永远都是一个特点,tm的不贴完整,我这里是个相对完整版的:(为了看的清楚点,替换了下名字)
<div id="div1">
"2">Hello world!
div>

<script type="text/x-template" id="template">
  <div>
    

if="level === 1">

if="level === 2">

if="level === 3">

if="level === 4">

if="level === 5">
if="level === 6">
div> script> <script type="text/javascript"> Vue.component('child', { template: '#template', props: { level: { type: Number, required: true } } }) new Vue({ el:"#div1" }) script>

回顾一下前面所学,这里注册了一个名叫child的全局组件,其模板是id=template的模板,往上一看发现,这个写法跟以前不一样啊,以前用的是