大风车滴呀滴溜溜地转
为天地立心,为生民立命,为往圣继绝学,为万世开太平。
展开
-
Vue事件总线(EventBus)
转载:Vue事件总线(EventBus)使用详细介绍转载 2020-11-08 21:56:51 · 1679 阅读 · 1 评论 -
Vue - Markdown编辑器
Hello,我是 Alex 007,一个热爱计算机编程和硬件设计的小白,为啥是007呢?因为叫 Alex 的人太多了,再加上每天007的生活,Alex 007就诞生了。最近在做工作室的官网,需要一套博客系统,今天做了个Markdown编辑器,回想起刚开始学前端的时候做一个富文本编辑器都费劲,今天拿Vue做简直不要太轻松。首先安装两个必须的包npm install loadshnpm install marked当然我还有提前引入的ElementUI。Coding<templ.原创 2020-08-04 21:39:31 · 997 阅读 · 0 评论 -
0.为什么要学习Vue?
Vue是一个用于创建用户界面的开源JavaScript框架,也是一个创建单页应用的Web应用框架。 在GitHub上,该项目平均每天能收获95颗星,为Github有史以来星标数第3多的项目。原创 2020-06-30 22:39:52 · 900 阅读 · 0 评论 -
1.Vue 安装与简单使用
Hello,我是 Alex 007,一个热爱计算机编程和硬件设计的小白,为啥是007呢?因为叫 Alex 的人太多了,再加上每天007的生活,Alex 007就诞生了。这篇文章我们来Vue的安装与简单使用。Vue的使用方式呢有很多种,第一种方式就是直接使用<script>标签的方式去引入,第二种方式呢,大家可以使用Vue官方提供的CLI命令行工具,去快速的搭建比较复杂的脚手架。作为初学者来讲呢,强烈建议大家先不使用命令行的方式去创建Vue的应用,那当我们对这个Vue有一定的了解和学.原创 2020-07-01 20:34:41 · 728 阅读 · 2 评论 -
2.Vue 声明式渲染
我们看这个 Vue.js 的起步和声明式渲染,Vue.js 的核心是一个允许采用简洁的模板语法来声明式地将数据渲染进 DOM 的系统,它的应用可以分为两个重要部分,一个是视图,另一个是脚本。原创 2020-07-02 15:46:50 · 1646 阅读 · 4 评论 -
3.Vue 条件渲染
这篇文章我们来讲一讲Vue中的指令和条件渲染,指令 (Directives) 是带有 v- 前缀的特殊 attribute,当表达式的值改变时,将其产生的连带影响,响应式地作用于 DOM。v-if 和 v-show 指令用于条件性地渲染一块内容。原创 2020-07-04 12:43:59 · 574 阅读 · 2 评论 -
4.Vue 模板语法
Vue.js 使用了基于 HTML 的模板语法,允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。所有 Vue.js 的模板都是合法的 HTML,所以能被遵循规范的浏览器和 HTML 解析器解析。原创 2020-07-07 23:59:35 · 1075 阅读 · 0 评论 -
5.Vue 计算属性和侦听器
这篇文章我们来看一下Vue的计算属性和侦听器。计算属性是自动监听依赖值的变化,从而动态返回内容,监听是一个过程,在监听的值变化时,可以触发一个回调,并做一些事情。侦听属性watch中可以执行代码逻辑,如函数节流,Ajax异步获取数据,甚至操作 DOM。原创 2020-07-07 23:59:42 · 410 阅读 · 0 评论 -
6.Vue Class 与 Style 绑定
Class 与 Style 绑定操作元素的 class 列表和内联样式是数据绑定的一个常见需求。因为它们都是 attribute,所以我们可以用 v-bind 处理它们:只需要通过表达式计算出字符串结果即可。不过,字符串拼接麻烦且易错。因此,在将 v-bind 用于 class 和 style 时,Vue.js 做了专门的增强。表达式结果的类型除了字符串之外,还可以是对象或数组。绑定 HTML Class对象语法我们可以传给 v-bind:class 一个对象,以动态地切换 class:<di原创 2020-07-07 23:59:49 · 870 阅读 · 0 评论 -
7.Vue 列表渲染
用 v-for 把一个数组对应为一组元素我们可以用 v-for 指令基于一个数组来渲染一个列表。v-for 指令是使用 item in items 形式的特殊语法,其中 items 是源数据数组,而 item 则是被迭代的数组元素的别名。<ul id="example-1"> <li v-for="item in items" :key="item.message"> {{ item.message }} </li></ul>var原创 2020-07-20 13:00:44 · 387 阅读 · 0 评论 -
8.Vue 事件处理
监听事件可以用 v-on 指令监听 DOM 事件,并在触发时运行一些 JavaScript 代码。示例:<div id="example-1"> <button v-on:click="counter += 1">Add 1</button> <p>The button above has been clicked {{ counter }} times.</p></div>var example1 = new Vu原创 2020-07-25 23:17:51 · 344 阅读 · 0 评论 -
9.Vue 表单输入绑定
基础用法你可以用 v-model 指令在表单 <input>、<textarea> 及 <select> 元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。尽管有些神奇,但 v-model 本质上不过是语法糖。它负责监听用户的输入事件以更新数据,并对一些极端场景进行一些特殊处理。`v-model` 会忽略所有表单元素的 `value`、`checked`、`selected` attribute 的初始值,总是将 Vue 实例的数据作为数据来源。你原创 2020-07-25 19:21:31 · 331 阅读 · 0 评论 -
10.Vue 组件基础
基本示例这里有一个 Vue 组件的示例:// 定义一个名为 button-counter 的新组件Vue.component('button-counter', { data: function () { return { count: 0 } }, template: '<button v-on:click="count++">You clicked me {{ count }} times.</button>'})组件是可复用的原创 2020-07-26 07:57:20 · 465 阅读 · 0 评论 -
Vue CLI:全局CLI配置
配置参考全局 CLI 配置有些针对 @vue/cli 的全局配置,例如你惯用的包管理器和你本地保存的 preset,都保存在 home 目录下一个名叫 .vuerc 的 JSON 文件。你可以用编辑器直接编辑这个文件来更改已保存的选项。你也可以使用 vue config 命令来审查或修改全局的 CLI 配置。目标浏览器browserslist你会发现有 package.json 文件里的 browserslist 字段 (或一个单独的 .browserslistrc 文件),指定了项目的目标浏览原创 2020-07-08 20:59:00 · 961 阅读 · 1 评论