Vue前端框架
关注
分享
扫一扫
致力于深入研究Vue的开发及应用。
巅峰键盘侠
致力于互联网软件技术普及与教育。
在软件公司负责系统架构、技术研发、技术管理工作多年，带领过60人以上技术团队，主导设计和开发过大型APP项目、Web项目，对缓存、集群、分布式、微服务、负载均衡等高并发处理技术有深刻理解，擅长Java技术，精通Spring Boot、Spring Cloud等Java框架，熟悉Docker、Kubernetes、Rancher等微服务容器化技术，掌握PHP技术，熟悉ThinkPHP、Laravel等PHP框架，具备Redis、RabbitMQ、MyCat、GlusterFS等NoSQL缓存、消息中间件、数据库中间件、分布式存储的应用经验。
展开
-
01 初识Vue：写一段最简单的Vue程序
阅读这篇文章之前，阁下需要掌握一点点的HTML、CSS、JavaScript代码基础，能看懂基础的标签和语法即可。1、安装IDE工具写代码，终归是要找一款像样的开发工具的，总不能上来就拿个txt开干吧，跟约会一样，没有谁会直接到第一次见面就叫女孩子去开房，言归正传，开发工具你来选一款：WebStorm，还是VS Code，自己装一个吧。我学习用的这台电脑装的是WebStorm 2018...原创 2019-08-24 23:25:10 · 646 阅读 · 1 评论 -
02 Vue基本用法：变量、模板绑定、属性绑定和事件绑定
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>02 VueJS基本用法</title> <script src="https://cdn.bootcss.com/vue/2.6.9/vue.min.js...原创 2019-08-25 08:52:28 · 2574 阅读 · 0 评论 -
03 Vue变量监听：watch、computed
1、watch监听单个变量watch用于监听单个变量或者对象，用法为：watch:{var_1:function(new_value, old_value) { // todo }}demo代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"&g...原创 2019-08-25 11:01:19 · 281 阅读 · 0 评论 -
04 Vue常用指令：v-if、v-for、:style、:class
1、v-show、v-if 指令<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>04 VueJS常用指令</title> <script src="https://cdn.bootcss.com/vu...原创 2019-08-25 12:21:02 · 1065 阅读 · 0 评论 -
05 Vue项目工程化：命令行创建项目、IDE工具创建项目
1、通过命令行创建（1）使用VueJS提供的可视化web 界面创建vue ui执行上述命令后，会在命令行看到启动了一个 http://localhost:8080 的URL地址：在浏览器打开这个地址，即可使用VueJS的可视化web界面来创建VueJS工程项目（2）使用vue命令在命令行窗口创建VueJS的工程化项目cd /User/apple/Documen...原创 2019-08-25 17:27:41 · 178 阅读 · 0 评论 -
06 Vue项目结构：在WebStorm中查看和了解项目
使用WebStorm或者命令行创建好Vue项目后，它就是一个典型的工程化项目了，这里以WebStorm为例展示一个我目前正在开发的商业项目，项目结构如下图所示：上图中，箭头指向的左侧红色框内就是Vue工程化项目的完整结构，这里讲解几个最核心的目录和文件：（1）/index.html 文件项目入口文件，一般不需要修改（2）/src 目录项目源码存放目录（3）/config...原创 2019-08-26 23:32:22 · 1212 阅读 · 0 评论 -
07 Vue组件化：创建组件、访问组件
1、使用WebStorm创建一个Vue项目2、使用命令行加载相关依赖cnpm install3、查看创建好的项目src目录结构如上图所示，WebStorm已经在src目录下生成了一个 /asserts 静态资源目录、一个 /components 组件目录、一个 /router 路由配置目录；其中 /components/HelloWrold.vue 文件就是一个Vue的组件，...原创 2019-08-27 14:18:00 · 136 阅读 · 0 评论