1、普通渲染组件  在app容器中插入login组件 <login></login>  一个app可以多个这种组件

<script>

var login = {

  template:'<div>这是登录组件</div>'

}

var vm = new Vue({

  el:"#app",

  data:{},

  methods:{},

  components:{

    login

  }

})

</script>

2、render渲染方法  把app容器替换为 渲染的login组件   一个app只能一个render

<script>

var login = {

  template:'<div>这是登录组件</div>'

}

var vm = new Vue({

  el:"#app",

  data:{},

  methods:{},

  render:function(creatElements){  //creatElements 是一个方法调用他能够将 指定的组件模板渲染为html结构  把app容器替换为 渲染的login组件

    // var html = creatElements(login)

    // return html

    return creatElements(login)

  }

})

</script>

实例的render方法渲染组件的更多相关文章

  1. 19 使用Vue实例的render方法渲染组件

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. 010 vue使用render方法渲染组件

    1.普通的组件渲染方式 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...

  3. render方法渲染组件和在webpack中导入vue

    使用component注册的组件div容器里可以放多个,但是使用render的只能放一个 <div id="app"> <p>我可以放两个</p> ...

  4. 使用render函数渲染组件

    使用render函数渲染组件:https://www.jianshu.com/p/27ec4467a66b

  5. 用ActionController::Renderer的render方法渲染模版

    使用Cable进行pub: ActionCable.server.broadcast "call", {address: AddressesController.render(@a ...

  6. 创建组件的方法,组件的props属性、state属性的用法和特点,父子组件传值,兄弟组件传值

    1.创建组件的方法   函数组件   class组件 1.1 函数组 无状态函数式组件形式上表现为一个只带有一个 `render()` 方法的组件类,通过函数形式或者 `ES6` 箭头 `functi ...

  7. React.js 小书 Lesson7 - 组件的 render 方法

    作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson7 转载请注明出处,保留原文链接和作者信息. React.js 中一切皆组件,用 React. ...

  8. 普通组件定义渲染和render渲染组件的区别(三)

    普通方式定义组件和效果: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...

  9. 组件的 render 方法

    React.js 中一切皆组件,用 React.js 写的其实就是 React.js 组件.我们在编写 React.js 组件的时候,一般都需要继承 React.js 的 Component(还有别的 ...

随机推荐

  1. Android Studio快捷键Ctrl+Shift+F不能用,全局搜索不能用;

    AS全局搜索Ctrl+Shift+F突然就不能用了,在AS找半天没有找到问题,原因竟然是和搜狗输入法的简繁切换冲突了:下面有图把简繁切换关闭或更换快捷键后,as的全局搜索就能用了:

  2. android:clipChildren属性,子布局超出父布局;

    是否允许子View超出父View的范围,Boolean型true .false ,默认true不允许: android:clipChildren="true":如下 android ...

  3. c#linq去除重复项并将相同数据的数量字段值相加

    这是执行前和执行后想要的效果 以下是用Sql语句实现的代码: select goodsno, goodsspec,SUM([count]) as count from goods group by g ...

  4. StanFord ML 笔记 第六部分&&第七部分

    第六部分内容: 1.偏差/方差(Bias/variance) 2.经验风险最小化(Empirical Risk Minization,ERM) 3.联合界(Union bound) 4.一致收敛(Un ...

  5. RHEL yum

    一.YUM源配置 使用RHEL自带的yum时会显示 #This system is not registered to Red Hat Subscription Management. You can ...

  6. Exchange Server and Update Rollup Build Numbers

    原文链接https://social.technet.microsoft.com/wiki/contents/articles/240.exchange-server-and-update-rollu ...

  7. 【Social listening实操】作为一个合格的“增长黑客”,你还得重视外部数据的分析!

    本文转自知乎 作者:苏格兰折耳喵 ----------------------------------------------------- 在本文中,作者引出了"外部数据"这一概 ...

  8. py库: scrapy (深坑未填)

    scrapy 一个快速高级的屏幕爬取及网页采集框架 http://scrapy.org/ 官网 https://docs.scrapy.org/en/latest/ Scrapy1.4文档 http: ...

  9. 1.如何在Cloud Studio上执行Python代码?

    1.在python文件下新建python文件,输入文件名后按Enter键生成,比如: one.py . 2.简单输入python代码: print "haha" 3.打开左下角的终 ...

  10. 【4-1】js函数、事件、补充知识

    一.函数操作 (一)字符串操作: (1)变量名.toLowerCase():--转小写     toUpperCase():----转大写 (2)变量名.substring(索引,截取到位数);--- ...