rockyxia
4年前 (2019-02-26) 7709浏览
Vue-SuperSlide
Vue-SuperSlide(Github) 是 SuperSlide 的 Vue 封装版本,API 配置及使用方法与 SuperSlide 几乎一致,让你能够便捷的在 Vue 工程中使用 SuperSlide。
简介
关于 SuperSlide 的详细介绍可以到 SuperSlide 官方网站 – 大话主席 进行查看。
大话主席的 SuperSlide 是多年以前...
rockyxia
6年前 (2017-05-16) 11527浏览
写在前面
学过了前面11个章节的知识,可以说你已经对vue2.0的基础知识有了一定程度的掌握,虽然在真正开发过程中,一些知识的使用会稍有不同,但是别慌,我们会把那部分内容在进阶系列,比如:单文件组件,过渡效果,状态管理vuex,路由vue-router,网络请求vue-resource等等。
那是不是就意味着我们现在还不能用基础知识做开发,当然不是,加强动手能力是进步的最好方式,我们今天就来用学过的基础知识...
rockyxia
6年前 (2017-05-08) 9760浏览
写在前面
在第六节《教你如何在html中绑定数据》的章节中,我们学会了如何给视图上的html标签绑定属性。
比如,给 <a> 标签绑定href属性,简单回忆一下:
<!-- v-bind指令 -->
<a v-bind:href="link"></a>
<!-- v-bind的缩写 -->
<a :href="link">...
rockyxia
6年前 (2017-05-08) 9481浏览
写在前面
第一节我们就介绍过,vue有两大核心:数据驱动和组件。
传送门:《Vue框架是什么,为什么选它?》
我们在之前的章节,已经详细地介绍了vue的数据驱动,从这一节开始,我们就来学习另一个核心:组件。
(没错,又是这张图)
组件是我们人为地把页面合理地拆分成一个个区块,让这些区块更方便我们重复使用,有了组件,我们可以更高效合理地开发和维护我们的项目。
竟然说得组件那么好用,那我们就来好好学学怎么使用...
rockyxia
6年前 (2017-05-08) 8541浏览
写在前面
这一节我们还是来继续介绍组件:组件之间如何通信。
第九节我们在介绍组件知识的时候,提到过组件可以接受参数props,这其实就是组件之间的一种通信方式:父组件→子组件传递数据。
父组件→子组件
那我们还是不厌其烦地再演示一遍:父组件→子组件传递数据。
组件实例的作用域都是孤立的,也就是子组件在模板template不能引用父组件的数据,那么,当子组件有需要使用父组件的时候,我们该怎么办呢?
这里,...
rockyxia
6年前 (2017-04-18) 7884浏览
写在前面
上一节我们学了5个重要的指令: v-text 、 v-html 、 v-show 、 v-if 、 v-else
传送门:《 实战前必须掌握的10个指令(上) 》
这一节,我们继续学习剩下的5个指令。话不多说,撸起来!
6. v-for 指令
有时候,我们的data中的存放的数据不是个简单的数字或者字符串,而是数组Array类型,这个时候,我们要把数组的元素展示在视图上,就需要用到vue提供...
rockyxia
6年前 (2017-04-18) 8262浏览
写在前面
这一节我们来学习并掌握在实战用一定会用到的10个指令,没错,是一定会用到,通过这些指令,可以让我们很方便的完成某些操作。掌握了这几个指令,我们距离实战就又近了一步。
1. v-text 指令
v-text 指令用于更新标签包含的文本,它的作用跟双大括号的效果一样。我们看看它的用法:
<div id="app">
<p v-text="msg"></p&g...
rockyxia
6年前 (2017-04-17) 14318浏览
写在前面
上两节我们学习了vue的实例知识:
第4节:vue实例的4个常用选项
第5节:vue 实例的生命周期
提醒一下,这两节的内容在后面实战的时候很重要,如果落下的同学可以回去翻看学习,不必害怕难学,这里没有难学的教程。
这一节,我们学习如何在html上绑定我们实例中的数据。
Mustache 语法
什么叫Mustache语法,别被这高大上的叫法吓到了,其实就是双大括号{{ }}的写法,在之前的章节我...
rockyxia
6年前 (2017-04-08) 8313浏览
写在前面
上两节我们都是讲vue的实例,简单创建和定义实例的4个常用选项,没看过的伙伴可以先去看上两节,按顺序学习比较容易掌握。
这一节我们学习vue实例的生命周期,没错,实例也跟动物一样,有自己的“生命”,实例也会经历出生至死亡的各个阶段。
Vue把整个生命周期划分为创建、挂载、更新、销毁等阶段,每个阶段都会给一些“钩子”让我们来做一些我们想实现的动作。学习实例的生命周期,能帮助我们理解vue实例的运作机...
rockyxia
6年前 (2017-03-30) 10159浏览
写在前面
上一节,我们讲过如何创建一个Vue实例,仅需4步走:
( 不厌其烦地复习一下 )
我们知道,定义一个Vue实例的参数有el(指定挂载的DOM元素),data(实例的数据),上一节讲过除了这两个之外,还可以定义其他参数。今天,我们就来学习在开发中,我们要怎么定义一个vue实例才能满足我们的需要?
下面,我们先用上一节的知识,先创建一个Vue实例:
<div id="app">&l...
rockyxia
6年前 (2017-03-27) 8748浏览
写在前面
我们之前说过,Vue是数据驱动视图的,只要model(模型层)的数据改变了,Vue就会帮我们改变视图上显示的内容,不用我们自己去动手写代码更新。那么,它是怎么做到的,我们的代码要怎么写才能做到这一点。
答案是:Vue实例。
先确保你的项目安装好Vue.js,安装教程:点击这里
安装好之后,我们来看看怎么创建和使用Vue实例,我们把它分成 4 步走。
第1步 创建语法
创建一个Vue实例的语法很...
rockyxia
6年前 (2017-03-23) 7097浏览
写在前面
上一节我们介绍了Vue.js框架,这一节,我们可以来试着动手写点小代码了。
1 简易安装
要使用Vue.js,我们得先把它安装到我们的项目中,说明了简易安装,我们讲解的肯定是最简单的方法,先不管那些高大上的费时间的安装方法,直接引入一个js文件,先把代码敲代码再说。
<head>
<meta charset="UTF-8">
<title>简易...
rockyxia
6年前 (2017-03-16) 8906浏览
写在前面
“大白话,讲编程”系列又回来了,这个系列我们一起学习的是Vue.js基础知识。你没看错,是基础知识。所以,哪怕你入行不久,相信你在的大白话风格下,也能学会。
但还是希望你有开发过html,css,javascript的项目经验,如果你连一点项目经验都没有,亦或者你早已掌握Vue.js的知识,那么这个系列不适合你当前的学习阶段。
这一个系列的Vuejs连载教程是同步转载自 web前端教程 微信公众号...