【GHS】Vue 基础知识

编程开发   © 文章版权由 admin 解释,禁止匿名转载

#楼主# 2020-12-30

Vue.js
   Vue是一款优秀的过程开源框架,也是现在WEB工程师必会的一项技能。

   它是一个渐进式的框架,所谓渐进式是指你可以对你的项目代码进行渐进的重构,比如最开始你的项目中所有页面的代码全部是由jQuery构建的,如果想将其重构为Vue的话则可以对某一些页面进行重构,这并不会影响其他页面的正常使用。

   目前Vue3正式版已经出来了,但是新手玩家学习还是从Vue2入手,再递进到Vue3。

安装方式
   CDN引入:

   本地引入,下载地址:

本帖含有隐藏内容,请您 回复 后查看


本帖含有隐藏内容,请您 回复 后查看

   NPM安装:

# 最新稳定版
$ npm install vue
Vue特点
基本概念
   使用Vue开发和jQuery开发是两种截然不同的体验,Vue是声明式的编程语言,而jQuery是命令式的编程语言。

   使用jQuery你可能会经常想,下一步我该怎么做,从细节到全局。

   但是使用Vue则是会有一个很良好的全局观,是由全局到细节的。

   这里不多说明,后续将会慢慢体会。

单页面开发
   Vue是单页面开发,即页面用不刷新,用一个页面来展示不同的内容。

   在Vue中有一个组件的概念,暂时可以这么理解。一个页面上有一个根标签(根组件),并且其中包含很多子标签(子组件),通过用户不同的操纵状态由Vue决定展示或隐藏哪些其内部的子标签(子组件)。

   这其实就是单页面开发的概念,如图所示:

   [图片]

简单体验
初次上手
   下面是使用Vue打印HELLO,WORLD,通过这个小案例你可以了解Vue的基本使用。

首先要生成一个Vue实例。
使用el来挂载元素,可以使用CSS选择器,以及JavaScript的选择器拿到原生DOM元素进行挂载。
将数据存放至data中。
使用Vue的mustache语法对data中的数据进行渲染,令其展示到被挂载元素模板上。

成为第一个回答人

评论

登录后才可发表内容
  • 主题

    106

  • 帖子

    82

  • 关注者

    0

Copyright © 2019 凯特网.   Powered by HYBBS 2.3.4  

Runtime:0.0860s Mem:2050Kb