Vue基础
关注
分享
扫一扫
浦东_攻城狮
本站(https://how2j.cn?p=944)服务
展开
-
一：Vue中的join(),reverse()与 split()函数用法解析
Java自学的网站(Java全栈工程师 | 以实例驱动学习 | how2j.cn)Html<div id="app-5"> <p>{{ message }}</p> <button v-on:click="reverseMessage">逆转消息</button></div>Vu原创 2018-04-23 10:45:25 · 37328 阅读 · 8 评论 -
1-3 条件渲染
条件渲染： v-if v-else v-else-if v-show(和v-if)效果一样 问题：v-if与v-show有什么区别？v-if 是“真正”的条件渲染，因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。v-if 也是惰性的：如果在初始渲染时条件...原创 2018-05-06 23:13:36 · 232 阅读 · 0 评论 -
1-2 模块语法和基本指令
数据绑定最常见的形式就是使用"Mustache"语法(双大括号)的文本插值 #模板语法 Vue组件: 包含三个部分 template：视图 script：逻辑 ...原创 2018-05-06 21:45:29 · 198 阅读 · 0 评论 -
1-11 emit和prop
子父组件相互通信这是父组件<template> <div> 父组件 <input type="text" v-model="num"> <Child @sendMsg="getMsg" :num="getNum"/> {{info}}原创 2018-05-12 23:09:49 · 277 阅读 · 0 评论 -
1-10 emit
自定义事件 我们知道，父组件使用prop传递数据给子组件，但子组件怎么跟父组件通信呢？这个时候Vue的自定义事件系统就派得上用场。 这是父组件<template> <div> 父组件 <Child @sendMsg="getMsg"/> {{info}}...原创 2018-05-12 22:38:10 · 186 阅读 · 0 评论 -
1-1 Vue环境搭建
#项目初始化 1、安装vue-cli脚手架(用于搭建vue所需的模板框架) cnpm install -g vue-cli，安装完成后，输入vue查看是否成功,输入vue list查看vue有那些子类npm install vue 2、初始化项目 vue init webpack my-pro...原创 2018-05-05 16:43:32 · 243 阅读 · 0 评论 -
1-8 style样式
Class与Style绑定 绑定HTML Class 对象语法：我们可以传给 v-bind:class 一个对象，以动态地切换 class<template> <div> <p v-bind:class="styleObj">Vue.js</p> </div&...原创 2018-05-11 22:07:14 · 165 阅读 · 0 评论 -
This usually happens because your environment has changed since running `npm install`
问题根本:这通常是因为运行NPM安装后环境发生了变化。运行“NPM重建节点SASS——强制”来为当前环境构建绑定。如何解决:此时运行按照提示执行 npm rebuild node-sass 命令，（如若不行，则先运行npm install node-sass命令执行）然后再运行 node命令，启动服务Java自学的网站(Java全栈工程师 | 以实例驱动学习 | how2j.cn...原创 2018-05-05 10:14:54 · 15737 阅读 · 5 评论 -
vue生命周期探究（一）
前言在使用vue开发的过程中，我们经常会接触到生命周期的问题。那么你知道，一个标准的工程项目中，会有多少个生命周期勾子吗？让我们来一起来盘点一下： 1、根组件实例：8个 (beforeCreate、created、beforeMount、mounted、beforeUpdate、updated、beforeDestroy、destroyed) 2、组件实例：8个 (be...转载 2018-05-04 22:25:53 · 387 阅读 · 0 评论 -
1-7 计算属性与表单
Java自学的网站(Java全栈工程师 | 以实例驱动学习 | how2j.cn) 计算属性和侦听器 computed计算属性和methods区别我们可以将同一函数定义为一个方法而不是一个计算属性。两种方式的最终结果确实是完全相同的。然而，不同的是计算属性是基于它们的依赖进行缓存的。计算属...原创 2018-05-10 21:24:34 · 588 阅读 · 0 评论 -
1-6 列表与事件
数据更新检测： 变异方法：引起视图更新 以push为例：<template> <!--在template，只能存在一个根组件--> <div class="event"> <ul> <li v-for="name in names"&am原创 2018-05-09 23:02:54 · 175 阅读 · 0 评论 -
1-5 事件监听
事件监听： 可以用 v-on 指令监听 DOM 事件，并在触发时运行一些 JavaScript 代码。html<div> <button v-on:click="num+=1">按钮</button> <p>{{num}}</p> </div>js...原创 2018-05-09 10:31:22 · 176 阅读 · 0 评论 -
组件化应用构建
组件系统是 Vue 的另一个重要概念，因为它是一种抽象，允许我们使用小型、独立和通常可复用的组件构建大型应用。仔细想想，几乎任意类型的应用界面都可以抽象为一个组件树：<!DOCTYPE html><html><head> <meta name="viewport" content="width=device-width" /> &转载 2018-04-24 17:12:31 · 338 阅读 · 0 评论 -
1-4 列表渲染
列表渲染： v-for原创 2018-05-08 21:19:29 · 162 阅读 · 1 评论 -
用vue-cli、webpack、vue-router构建单页应用
vue-cli:一个官方发布 vue.js 项目脚手架，使用 vue-cli 可以快速创建 vue 项目webpack:是当下最热门的前端资源模块化管理和打包工具。它可以将许多松散的模块按照依赖和规则打包成符合生产环境部署的前端资源vue-router:SPA单页应用必备路由模块（下面详细介绍） 1.搭建环境 搭建环境之前，你需要在本地安装node.js,npm...原创 2018-05-08 16:09:50 · 1030 阅读 · 0 评论