Dora_5537的博客

Vue.js 提供了一个官方命令行工具，可用于快速搭建大型单页应用。相关网址：菜鸟教程：http://www.runoob.com/vue2/vue-install.htmlvue-cli官网：https://cli.vuejs.org/guide/creating-a-project.html一. 目录结构：二. 步骤总结：这是在搭建过程中用到的6行命令，按顺序...

vue-router是vue单页面应用中的一个路径管理器。vue单页面应用(SPA)的核心之一是: 更新视图而不重新请求页面。而传统的页面应用，是用一些超链接来实现页面切换和跳转的，每次更新视图都需要重新请求页面，这是我们不想看到的（请求过多）。vue的单页面应用是基于路由和组件的，路由用于设定访问路径，并将路径和组件映射起来。所以在vue-router单页面应用中，页面的切换和跳转则是路...

相同点：v-if 与 v-show 都可以动态控制 DOM 元素的显示隐藏。不同点：1. 手段：v-if 是动态的向 DOM 树内添加或者删除 DOM 元素；v-show 是通过设置 DOM 元素的 display 样式属性控制显示隐藏，DOM 元素保留；2. 编译过程：v-if 切换有一个局部编译/卸载的过程，切换过程中合适地销毁和重建内部的事件监听和子组件；v-show 只是简单的...

效果图：安装：cnpm install vue-html5-editor --save-dev使用：1.在 index.html 文件中引入图标样式：<link href="https://cdn.bootcss.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet">2.在 m...

一、登陆页面1.checkbox+button<el-checkbox v-model="AccountForm.checked">记住密码</el-checkbox><el-button type="primary" style="width: 372px" @click="submitForm()">登录</el-button>...

一、登陆页面1.checkbox+button<el-checkbox v-model="AccountForm.autoLogin">一周内自动登录</el-checkbox><el-button type="primary" style="width: 372px" @click="submitForm()">登录</el-button...

效果图：安装：cnpm install --save chart.js使用：首先，在<template></template>中写入：<div class="chart-container" style="position: relative;width: 550px;height: 335px;margin: auto"> ...

总结1. 什么是 Vuex？Vuex 是一个状态管理模式，它主要用于多视图之间状态的全局共享与管理。Vuex 有五种属性，分别是： State、 Getter、Mutation 、Action、 Module。vuex的State特性 A、Vuex就是一个仓库，仓库里面放了很多对象。其中state就是数据源存放地，对应于一般Vue对象里面的data B、state里面存放的数据...

《 Vue 组件化设计》测试题一、关于MVVM的理解1.Model 代表数据模型，也可以在 Model 中定义数据修改和操作的业务逻辑。2.View 代表 UI 组件，它负责将数据模型转化成 UI 展现出来。3.当数据发生变化，ViewModel 能够监听到数据模型的变化，然后通知对应的视图做自动更新；而当用户操作视图时，ViewModel 也能监听到视图的变化，然后通知数据...

一、虚拟 DOM转载原文：vue2.0为什么要新增虚拟dom1.什么是虚拟 DOM所谓虚拟DOM, 其实就是用js来模拟DOM结构，把DOM的变化操作放在js层来做，尽量减少对DOM的操作（原因应该是操作js比操作DOM的速度快许多）。然后对比前后两次虚拟DOM的变化，只重新渲染变化了的部分，而没有变化的部分则不会重新渲染。比如，我们有以下DOM结构：<ul id="l...

在WebStorm中怎么打开一个已有的项目，这个不用多说，那么如何运行一个vue项目呢？1.点击下图中右上角的红框。2.在出现的弹框中选中左上角“+”下的“npm”，如下图所示。3.选中第二步的“npm”之后，会出现下图。4.这里有3个地方需要更改，如下图所示。更改完成之后，依次点击右下角的“Apply”和“OK”。其中，Name——自己随意取； ...

在https://blog.youkuaiyun.com/Dora_5537/article/details/87918022这篇博客中，我们使用vue-cli 新建了自己的项目；在https://blog.youkuaiyun.com/Dora_5537/article/details/87921443这篇博客中，我们使用WebStorm打开并运行了自己的项目；接下来，我们就简单使用vue router...

参考官方文档：http://element-cn.eleme.io/#/zh-CN/component/installationnpm 安装推荐使用 npm 的方式安装，它能更好地和webpack打包工具配合使用。npm i element-ui -S完整引入 Element在 main.js 中写入以下内容：import ElementUI from 'eleme...

这篇博客的讲述基于如何使用 element-ui 之 NavMenu 导航菜单 中 的 router 属性（在激活导航时以 path 进行路由跳转），大家可以先去看看上篇博客。要实现在不同的路径下激活同一个菜单，需修改一个函数，即上篇博客中的 onRouteChanged () 函数，完整代码如下所示： methods: { onRouteChanged () { ...

1.新建一个commonFunction.js文件在这里，写入函数方法，如下图所示：export function commonFun1 ( param1,param2 ) { 函数体}export function commonFun2 () { 函数体 Fun ()}function Fun () { 函数体}2.在所需页面引入函数方...

这篇博客的讲述基于使用 vue-router 之导航守卫 + localStorage 实现在未登录状态下跳转到登录页面的功能，大家可以先去看看上篇博客。具体实现：1.router.js文件现在以superadmin、admin、user三种不同的用户角色为例，在定义路由时，加上该路由可以由哪种用户角色来访问，代码如下所示:比如说，/HelloWorld 页面这三种用户角色均可...

vue-router 之导航守卫的官网地址具体实现：1.router.js文件在定义路由的时候，加上 meta: {requireAuth: true}，定义一个完整路由的代码如下所示 ： { path: '/HelloWorld', name: 'HelloWorld', component: HelloWorld, me...

效果图：使用：1.<template><el-header style="height: 61px" > <el-menu mode = "horizontal" background-color = "#76c7f4" text-color = "#000000" active-text-color ...

一、MVC1. MVC 是Model-View-Controller 的缩写，即 模型—视图—控制器。Model：后端传递的数据。 View：所看到的页面。 Controller：页面业务逻辑。2.MVC是单向通信。即View和Model，必须通过Controller来承上启下。3.使用MVC的目的就是将M和V的代码分离。4.MVC 和 MVVM 的区别并不是VM完...

效果图：安装：cnpm install --save @antv/g2使用：首先，在<template></template>中写入：<div id="barG2"></div>其次，在<script></script>中写入：<script>import G2 from '...