vue框架简介及其优势

Vue 是一套用于构建用户界面的渐进式JavaScript框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用(SPA)提供驱动。
Vue.js是一套构建用户界面的渐进式框架。与其他重量级框架不同的是,Vue采用自底向上增量开发的设计。Vue 的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已有项目整合。另一方面,Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。

vue特点

Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。组件化开发, 提高代码的复用率。声明式编程, 以前是命令式编程, 不再操作复杂的DOM 树。
vue中提供了MVVM数据绑定和一个可组合的组件系统,具有简单、灵活的API,可以实现响应式的数据绑定和可组合的视图。遵循MVVM模式(m->model(数据对象) v->view(视图) vm->view model),编码简洁,体积小,运行效率高,适合移动端/PC端。
指令主要包括内置指令和自定义指令,以“v-”开头,作用于HTML元素。指令提供了一些特殊的特性, 将指令绑定在元素上时,指令会给绑定的元素添加一些特殊的行为。 例如,v-bind动态绑定指令、v-if 条件渲染指令、v- for列表渲染指令等。

vue的实现方式

Vue.js 不支持 IE8 及其以下版本,因为 Vue.js 使用了 IE8 不能模拟的 ECMAScript 5 特性。 Vue.js 支持所有兼容 ECMAScript 5 的浏览器。
vue框架

标签引入

直接下载并用 <script> 标签引入,Vue 会被注册为一个全局变量。重要提示:在开发时请用开发版本,遇到常见错误它会给出友好的警告。开发环境不要用最小压缩版,不然就失去了错误提示和警告!

NPM方式

在用 Vue.js 构建大型应用时推荐使用 NPM 安装, NPM 能很好地和诸如 Webpack 或 Browserify 模块打包器配合使用。 Vue.js 也提供配套工具来开发单文件组件。
有两种构建方式,独立构建和运行构建。它们的区别在于前者包含模板编译器而后者不包含。模板编译用于编译 Vue 模板字符串成纯 JavaScript 渲染函数。如果你想用 template 选项, 你需要编译。模板编译器的职责是将模板字符串编译为纯 JavaScript 的渲染函数。如果你想要在组件中使用 template 选项,你就需要编译器。

对于SEO不友好

seo 本质是一个服务器向另一个服务器发起请求,解析请求内容。但一般来说搜索引擎是不回去执行请求到的js的。也就是说,如果一个单页应用,html在服务器端还没有渲染部分数据数据,在浏览器才渲染出数据,而搜索引擎请求到的html是没有渲染数据的。
VUE的的页面数据展示是其工作过程的最终数据渲染页面(也就是VUE生命周期的Mounted阶段),所以说用JS来渲染数据对SEO不友好。对于SEO支持比较好的项目方案是采用服务端渲染。所以如果项目有SEO需求,那么比较好的方案是服务端渲染。

申明:本站内容仅代表个人观点,仅供学习参考;未经授权任何个人或组织单位不得复制、转载、摘编以及其它形式的应用!

本站文章可能使用到互联网上的资料,若对您造成困扰,请联系 kk19@foxmail.com除理

本文地址:https://www.chateach.com/it/vue/835

相关文章

  • 使用nginx部署vue项目

    nginx部署vue项目

    使用nginx部署vue项目,​node自己本身可以作为服务器进行驱动,但是node本身对文件的处理能力并不是很好,所以当我们的生产环境中应尽量使用nginx来处理静态的资源以及反向代理,同时也解决了node分布式以及负载均衡的相关问题。

    用于表示时间的图标 一个时钟的图标,用于向用户表达后面跟着的是一个时间
    用于表示阅读次数的图标 一个类似睁开眼睛的图标,用于向用户表达后面跟着的数字是一个阅读的次数 1603
    • nginx部署vue项目
  • MySQL常用查询语句大全

    Mysql查询语句

    MySQL常用的查询语句大全看这里,值得收藏。MySQL数据库管理系统由瑞典的DataKonsultAB公司研发,该公司被Sun公司收购,现在Sun公司又被Oracle公司收购,因此MySQL目前属于 Oracle 旗下产品。

    用于表示时间的图标 一个时钟的图标,用于向用户表达后面跟着的是一个时间
    用于表示阅读次数的图标 一个类似睁开眼睛的图标,用于向用户表达后面跟着的数字是一个阅读的次数 1279
    • Mysql查询语句
  • 原生js 复制内容到剪切板代码实现

    js 复制内容,剪切板代

    有时候为了提升用户体验,比如在某些页面需要实现点击内容,将内容复制到剪切板,可以提升用户复制内容的操作效率;因此在实际操作中通过一定的事件触发复制功能是非常有意义的行为,下面是两种通过原生js实现复制内容到剪切板。

    用于表示时间的图标 一个时钟的图标,用于向用户表达后面跟着的是一个时间
    用于表示阅读次数的图标 一个类似睁开眼睛的图标,用于向用户表达后面跟着的数字是一个阅读的次数 1639
    • js 复制内容
    • 剪切板代
  • Java如何生成随机字符串

    Java字符串

    Java如何生成随机字符串,先定义一个基础字符串(即生成的每一个随机字符串里的每一个字符都要包含在这个基础字符串里面),包含字符"0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ"。

    用于表示时间的图标 一个时钟的图标,用于向用户表达后面跟着的是一个时间
    用于表示阅读次数的图标 一个类似睁开眼睛的图标,用于向用户表达后面跟着的数字是一个阅读的次数 1583
    • Java字符串
  • 如何解决Vue中mounted不能获取到data

    mounted获取data

    Vue中使用mounted时,无法获取到data的原因是,this无法指向data中的数据。在mounted生命周期中this指向的是window对象而不是Vue对象,所以真正找的是window对象下的data,但是window下没有data,所以就报错了。

    用于表示时间的图标 一个时钟的图标,用于向用户表达后面跟着的是一个时间
    用于表示阅读次数的图标 一个类似睁开眼睛的图标,用于向用户表达后面跟着的数字是一个阅读的次数 2159
    • mounted获取data
  • .gitignore不生效问题解决方法

    gitignore不生效

    git push的时候 .gitignore中已经标明忽略的文件目录下的文件,git push的时候还会出现在push的目录中,或者用git status查看状态,想要忽略的文件还是显示被追踪状态。

    用于表示时间的图标 一个时钟的图标,用于向用户表达后面跟着的是一个时间
    用于表示阅读次数的图标 一个类似睁开眼睛的图标,用于向用户表达后面跟着的数字是一个阅读的次数 1579
    • gitignore不生效
  • 如何修改重置mysql密码

    重置mysql密码

    人生处处充满着意外,忘记了mysql密码无法登陆数据库,就需要重置mysql密码,今天以linux环境下的mysql数据密码的重置。大致的原理就是设置跳过数据库密码,然后设置登陆密码,在恢复数据登陆权限。

    用于表示时间的图标 一个时钟的图标,用于向用户表达后面跟着的是一个时间
    用于表示阅读次数的图标 一个类似睁开眼睛的图标,用于向用户表达后面跟着的数字是一个阅读的次数 1077
    • 重置mysql密码
  • Java实现哈希加解密(HmacSHA1、HmacMD5、HmacSHA256、HmacSHA512)

    Java哈希加解密

    什么是Hash,Java实现哈希加解密(HmacSHA1、HmacMD5、HmacSHA256、HmacSHA512),哈希算法不可逆,不同的源数据使用同样的哈希算法,可能会产生相同的哈希值,这被称之为碰撞率(collision rate),即使是 MD5 算法,碰撞率也非常小,小到几乎可以忽略不计。大约是 1.47*10的负29次方。

    用于表示时间的图标 一个时钟的图标,用于向用户表达后面跟着的是一个时间
    用于表示阅读次数的图标 一个类似睁开眼睛的图标,用于向用户表达后面跟着的数字是一个阅读的次数 2764
    • Java哈希加解密
  • JS中的indexOf方法

    indexOf

    indexOf()是js中内置的方法之一,它的功能大家都很熟悉:简单来说就是得到数据的索引,对于正则不熟练的人,是个很不错的方法。string中indexOf() 会将数值参数转换为字符再查询索引;number类型没有IndexOf() 可以转换为字符再使用;array中indexOf() 是严格比较

    用于表示时间的图标 一个时钟的图标,用于向用户表达后面跟着的是一个时间
    用于表示阅读次数的图标 一个类似睁开眼睛的图标,用于向用户表达后面跟着的数字是一个阅读的次数 1120
    • indexOf
  • php生成n位随机数

    php随机数

    php如何生成n位的随机数,给大家分享一个简单高效的方法,这里以随机生成6位数作为一个例子给大家演示。使用php的str_pad()和mt_rand()函数生成随机数。

    用于表示时间的图标 一个时钟的图标,用于向用户表达后面跟着的是一个时间
    用于表示阅读次数的图标 一个类似睁开眼睛的图标,用于向用户表达后面跟着的数字是一个阅读的次数 1922
    • php随机数
  • laravel url路由中存在双斜杠(//)造成404问题

    laravel路由双斜杠

    解决在laravel框架下,网站的首页后面加上双斜杠(//),页面显示的尽然不是首页,是一个空白的页面状态码是200,或者报404错误。

    用于表示时间的图标 一个时钟的图标,用于向用户表达后面跟着的是一个时间
    用于表示阅读次数的图标 一个类似睁开眼睛的图标,用于向用户表达后面跟着的数字是一个阅读的次数 2502
    • laravel路由双斜杠
  • 页面资源加载真实进度条的详细教程

    进度条,资源加载

    分享一个基于原生javascript语法不需要任何插件来实现进度条的真实加载,按照加载资源数量的控制进度条的变化,可以实现只要网站每加载完成一个资源进度条同步变化。给站点一个真实的进度条对于用户体验还是非常友好的,一个真实的进度条可以一定程度上可以增加用户继续等待的机率。

    用于表示时间的图标 一个时钟的图标,用于向用户表达后面跟着的是一个时间
    用于表示阅读次数的图标 一个类似睁开眼睛的图标,用于向用户表达后面跟着的数字是一个阅读的次数 2474
    • 进度条
    • 资源加载
  • Laravel邮件发送功能的实现例子

    Laravel邮件发送

    Laravel如何发送邮件呢?Laravel邮件发送功能的实现例子,从邮箱注册配置到,laravel邮件参数配置,提供纯文本邮件和富文本邮件发送两种邮件发送实例。

    用于表示时间的图标 一个时钟的图标,用于向用户表达后面跟着的是一个时间
    用于表示阅读次数的图标 一个类似睁开眼睛的图标,用于向用户表达后面跟着的数字是一个阅读的次数 2049
    • Laravel邮件发送
  • js中的数组元素的添加方法

    js数组添加元素

    js中的数组元素的添加方法,主要有三种方法,用索引元素添加、push( )方法、unshift()方法,push()方法在数组的尾部添加一个或多个元素,并返回数组新的长度,修改并替换了原始数组而非生成一个修改版的新数组。

    用于表示时间的图标 一个时钟的图标,用于向用户表达后面跟着的是一个时间
    用于表示阅读次数的图标 一个类似睁开眼睛的图标,用于向用户表达后面跟着的数字是一个阅读的次数 1045
    • js数组添加元素
  • 拥有一个博客网站需要多少钱

    博客网站

    如果你喜欢记录生活,那么拥有一个个人的博客网站还是非常不错的,从此你不再需要遵守任何平台的规则,只需要遵守我国法律即可。人生在世短短几十年,为短暂的人生留下点痕迹,成为数字世界的终极身份证。今天潘某人SEO就为大家大致的总结一下拥有一个自己网站需要哪几步并需要多少花费。

    用于表示时间的图标 一个时钟的图标,用于向用户表达后面跟着的是一个时间
    用于表示阅读次数的图标 一个类似睁开眼睛的图标,用于向用户表达后面跟着的数字是一个阅读的次数 5668
    • 博客网站
  • php简介

    什么是php

    PHP即“超文本预处理器”,是一种通用开源脚本语言。PHP是在服务器端执行的脚本语言,与C语言类似,是常用的网站编程语言。PHP独特的语法混合了C、Java、Perl以及 PHP 自创的语法。利于学习

    用于表示时间的图标 一个时钟的图标,用于向用户表达后面跟着的是一个时间
    用于表示阅读次数的图标 一个类似睁开眼睛的图标,用于向用户表达后面跟着的数字是一个阅读的次数 1693
    • 什么是php
  • 原生AJAX请求实例教程

    AJAX

    如何使用原生javascript进行ajax数据请求呢?可以不重新加载整个网页通过刷新网页部分内容达到数据的更新展示。可以有效的降低对带宽的需求,提高网页的性能;Ajax有同步和异步两种实现方式。

    用于表示时间的图标 一个时钟的图标,用于向用户表达后面跟着的是一个时间
    用于表示阅读次数的图标 一个类似睁开眼睛的图标,用于向用户表达后面跟着的数字是一个阅读的次数 1477
    • AJAX
  • laravel下数据密码正确但还是无法连接

    laravel数据库链接

    使用laravel框架的时候,数据的密码确认是正确的但是就是无法连接成功数据库。出现这种情况往往并不是数据库的配置或者密码等参数存在问题,其实你只是少了非常关键的一步清空配置缓存。

    用于表示时间的图标 一个时钟的图标,用于向用户表达后面跟着的是一个时间
    用于表示阅读次数的图标 一个类似睁开眼睛的图标,用于向用户表达后面跟着的数字是一个阅读的次数 1723
    • laravel数据库链接