2019-3-31 为什么选择Vue 有这个一个需求,我们需要根据后端数据接口请求返回的数组在页面中按列表展示? 传统上我们使用jQuery的Ajax发送http请求,获取数据.判断列表数据是否存在,如果不存在,显示一条提示信息;如果存在,则显示出来. <ul class="js-data"></ul> <script> $(document).ready(function () { $.get("https://example.com/a…
全部章节 >>>> 文章目录 一.Vue组件介绍 1.组件概述 2.组件使用步骤 3.实践练习 一.Vue组件使用 1.组件注册 2.组件注册语法糖 3.使用script或template标签 4.组件的el和data选项 5.实践练习 三.组件之间的通信 1.父组件和子组件 2.通过props向子组件传递数据 3.实践练习 四.Vue的插槽 1.插槽使用 2.作用域插槽使用 3.实践练习 总结: 一.Vue组件介绍 1.组件概述 组件系统是Vue其中一个重要的概念,它提供了一种抽…
什么是Vue? 1.Vue.js是一个构建数据驱动的web界面的库.类似于Angularjs,在技术上,他重点集中在MVVM模式的View层,非常容易学习,非常容易和其他的库或已有的项目整合. 2.Vue.js的目标是通过尽可能简单的API实现响应的数据绑定和组合的视图组件. 3.Vue.js的核心是一个响应的数据绑定系统,他让数据与DOM保持同步非常简单. Vue的安装: 三种: 1.独立版版本 2.CDN 3.NPM Vue起步 Vue的功能 数据渲染: <!DOCTYPE html> &…
国外网站:https://www.crx4chrome.com/ 国内网站:http://www.cnplugins.com/ http://chromecj.com/web-development/2018-01/886/download.html 1.能上外网的情况下直接安装 打开谷歌浏览器,点击左上角应用,打开 chrome 网上应用商店 在左侧直接搜索,就可以看到这个插件了 安装后在浏览器右上角会显示 vue 的图标 在这个扩展的安装路径下找到 manifest.json 文件,把 "p…
windows下搭建vue开发环境 Vue.js是一套构建用户界面的 “渐进式框架”.与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计.Vue 的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已有项目整合.2016年,Vue同Angular.React形成三足鼎立的局面,让前端的开发者顾不暇接,今天我们就来了解一下Vue的环境搭建. 一.node.js安装Vue项目通常通过webpack工具来构建,而webpack命令的执行是依赖node.js的环境的,所以首先要安装nod…
原文:intro-to-vue-3-vue-cli-lifecycle-hooks 译者:nzbin 这是 JavaScript 框架 Vue.js 五篇教程的第三部分.在这一部分,我们将学习 Vue-cli ,还会涉及真实的开发流程.这个系列教程并不是一个完整的用户手册,而是通过基础知识让你快速了解 Vuejs 以及它的用途. 系列文章: 渲染, 指令, 事件 组件, Props, Slots Vue-cli (你在这!) Vuex 动画 Vue-cli 和构建过程 如果你还没有读过上一部分关…
上次我们学习了Vue.js的基础,并且通过综合的小实例进一步的熟悉了Vue.js的基础应用.今天我们就继续讲讲Vue.js的组件,更加深入的了解Vue,js的使用.首先我们先了解一下什么是Vue.js的组件,组件其实就是页面组成的一部分,它是一个具有独立的逻辑和功能或页面,组件可以扩展 HTML 元素,封装可重用的代码.组件系统让我们可以用独立可复用的小组件来构建大型应用,几乎任意类型的应用的界面都可以抽象为一个组件树,如下图: 接下来我们就仔细讲讲组件的使用吧. 1 全局组件 以下就是我们注册…
1:首先引入vue.js 2:点击事件 <div id='clickVue'> <p>{{message}}</p> <button v-on:click="reverseMessage">逆转文字</button> </div> var app = new Vue({ el: "#clickVue", data: { message: 'Hello Vue.js!' }, methods: {…
vue实例基本结构与MVVM框架 (1)vue实例基本结构 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv=&…
promise 它将我们从回调地狱中解脱出来 创建和使用 var fs = require('fs') // 创建promise // reslove表示执行成功后调用的回调函数 // reject表示出现错误后调用的回调函数 var p1 = new Promise((reslove, reject) => { fs.readFile('a.txt', "utf-8", (err, data) => { if (err) { reject(err) } else { re…