当前位置: 首页 > news >正文

【前端】main.js中app.vue中 render函数的作用及使用背景

vue.js中的main.js中的作用是将app组件挂载到页面中,其中app组件是汇总所有组件元素的组件。main.js的创建vue实例。

#认为的版本
import APP from './App.vue';new Vue({el:'#root',template:'<App></App>',components:{App},
})#实际的版本
/*
整个项目的入口文件
*/
//引入vue
import Vue from ‘vue’  //引入的是残缺版的vue,//引入app组件,所有组件的父组件
import App from './App.vue'//关闭生产提示
Vue.config.productionTip = falsenew Vue({//将app组件放入容去中render: h => h(App),
}).$mount('#app’)/*
这里的new Vue({}).$mount('#app') 就等同于 new Vue({ el:'#app' })
*/

上述两个版本之间的区别在于用了render函数和没有用render函数,render的作用是将js中所搭建的标签模版渲染到页面中。
认为的版本在vue脚手架创建的项目里是不可运行的,因为脚手架中到实际运行的js中是没有模版解析器的,只是在开发阶段有,打包成浏览器所认识的版本是没有的。如果想使用需要引入完整版的vue.js 但是这会导致vue内容多。可能会导致性能降低。

Vue = 核心+模版解析器(1/3) 带有runtime的vue.runtime.xxx.js都是运行时vue 没有模版解析器的文件。

在这里插入图片描述

最简单的render函数的使用

render函数

render(createElement){return createElement(‘h1’,'你好啊’);
}

ps: 简单来说,render函数字符串模版的代替方案,接收createElement创建的标签来将所创建的dom元素渲染到页面上。

大家加油,不要让潜在堕落期的自己打败向上的自己。

相关文章:

  • 北京网站建设多少钱?
  • 辽宁网页制作哪家好_网站建设
  • 高端品牌网站建设_汉中网站制作
  • 黑马头条day2-预览
  • MME-RealWorld:您的多模态大型语言模型能挑战高分辨率的真实世界场景吗?这些场景对人类来说都非常困难!
  • 自动化测试Mock神器:轻松模拟HTTP请求!
  • 【深度学习】(2)--PyTorch框架认识
  • 简单题66-加一(Python)20240918
  • GUI编程16:图片按钮、单选框、多选框
  • Ubuntu 22.04上安装Java JDK 8
  • 自定义Spring Security认证处理的完整解决方案
  • OpenCV 1
  • Vue Router 编程式导航全攻略:深入掌握 push, replace, go, back, forward,beforeEach 方法
  • 术语“in law”(在分布上)
  • Gitee丝滑版本:成功在新电脑添加新文件
  • stm32 PWR电源控制(修改主频睡眠模式停机模式待机模式)
  • 无限边界:现代整合安全如何保护云
  • Unity 设计模式 之 创造型模式-【工厂方法模式】【抽象工厂模式】
  • (三)从jvm层面了解线程的启动和停止
  • 【108天】Java——《Head First Java》笔记(第1-4章)
  • 【附node操作实例】redis简明入门系列—字符串类型
  • 2018天猫双11|这就是阿里云!不止有新技术,更有温暖的社会力量
  • 2019.2.20 c++ 知识梳理
  • GDB 调试 Mysql 实战(三)优先队列排序算法中的行记录长度统计是怎么来的(上)...
  • Javascript弹出层-初探
  • Java编程基础24——递归练习
  • Laravel 菜鸟晋级之路
  • leetcode98. Validate Binary Search Tree
  • Node 版本管理
  • PHP 的 SAPI 是个什么东西
  • PHP那些事儿
  • rc-form之最单纯情况
  • Solarized Scheme
  • windows下mongoDB的环境配置
  • - 概述 - 《设计模式(极简c++版)》
  • 基于 Ueditor 的现代化编辑器 Neditor 1.5.4 发布
  • 计算机常识 - 收藏集 - 掘金
  • 坑!为什么View.startAnimation不起作用?
  • 一个SAP顾问在美国的这些年
  • 移动互联网+智能运营体系搭建=你家有金矿啊!
  • 如何用纯 CSS 创作一个货车 loader
  • 曜石科技宣布获得千万级天使轮投资,全方面布局电竞产业链 ...
  • # windows 运行框输入mrt提示错误:Windows 找不到文件‘mrt‘。请确定文件名是否正确后,再试一次
  • #C++ 智能指针 std::unique_ptr 、std::shared_ptr 和 std::weak_ptr
  • (2.2w字)前端单元测试之Jest详解篇
  • (STM32笔记)九、RCC时钟树与时钟 第一部分
  • (附源码)ssm高校社团管理系统 毕业设计 234162
  • (附源码)计算机毕业设计SSM在线影视购票系统
  • (介绍与使用)物联网NodeMCUESP8266(ESP-12F)连接新版onenet mqtt协议实现上传数据(温湿度)和下发指令(控制LED灯)
  • (力扣记录)235. 二叉搜索树的最近公共祖先
  • (论文阅读30/100)Convolutional Pose Machines
  • (十)T检验-第一部分
  • (算法)N皇后问题
  • (一)Docker基本介绍
  • (转) ns2/nam与nam实现相关的文件
  • (转载)OpenStack Hacker养成指南
  • (转载)深入super,看Python如何解决钻石继承难题
  • ******IT公司面试题汇总+优秀技术博客汇总