概述本节内容是在上一篇的基础上，实现对象类型的数据渲染，渲染到真实页面中难点有：如何知道单个vnode中有那些模板语法如何实现知道模板语法对应的值如何实现数据的替换，实现页面渲染流程概览图示找到模板语法在上文中我们实现了模板和vnode之间的相互映射，且用Map对象保存，所以可通过Map的内置方法实现代码实现 /*** 渲染虚拟DOM* @param {*} vm* @param {*} vnode*/function renderVNode(vm, vnode) {if (vnode.nodeType =...
前言每个框架都不可避免会有自己的一些特点，从而会对使用者有一定的要求，这些要求就是主张，主张有强有弱，它的强势程度会影响在业务开发中的使用方式。 一、Angular，它两个版本都是强主张的，如果你用它，必须接受以下东西：必须使用它的模块机制必须使用它的依赖注入必须使用它的特殊形式定义组件（这一点每个视图框架都有，难以避免）所以Angular是带有比较强的排它性的，如果你的应用不是从头开始，而是要不断考虑是否跟其他...
1、安装node.js 1）在https://nodejs.org/en/download/ 下载最新linux nodejs包，以v10.15.3为例：wget https://nodejs.org/dist/v10.15.3/node-v10.15.3-linux-x64.tar.gztar zxvf node-v10.15.3-linux-x64.tar.gz mv node-v10.15.3-linux-x64 /usr/local/nodejs ln -s /usr/local/nodejs/bin/npm /usr/local/bin/ ln -s /usr/local/nodejs/bin/node /usr/local/bin/2、安装cnpm（安装cnpm是因为使用npm install安装包时速度很...
小组件在components文件夹中，页面组件在views文件夹中一、先写小组件的vue,比如text.vue(在template设置模板渲染，style设置样式)<template><div class="text"><p>tttt</p></div> </template><script>export default {name: "text"} </script><style scoped>.text {color: red;} </style>二、页面组件（Home.vue）中使用小组件需要这几步：1.先导入小组件（import T from ‘@/components/text‘）2.然后在export default中注册小组...
前言：在leaflet的官方文档只有静态的HTML演示并没有结合VUE的demo 虽然也有一些封装好的leaflet库例如Vue-Leaflet，但是总感觉用起来不是那么顺手，有些业务操作还是得用leaflet的API好用步骤1：npm install leaflet （搭建vue项目就跳过了）页面中先下载好npm包 下一步就是在vue用引用了（以下方法都是网上教程自己整理出来的）import L from "leaflet"; import "leaflet/dist/leaflet.css";步骤2：leaflet初始化HTML<div id=...
本文来自网易云社区。前瞻当前前端界空前繁荣，各种框架横空出世，包括各类mvvm框架横行霸道，比如Angular、Regular、Vue、React等等，它们最大的优点就是可以实现数据绑定，再也不需要手动进行DOM操作了，它们实现的原理也基本上是脏检查或数据劫持。那么本文就以Vue框架出发，探索作者运用Object.defineProperty来实现数据劫持的奥秘（本文所选取的相关代码源自于Vue v2.0.3版本的源码）。回顾一下Object.defineProperty语法 Ob...
1 、安装依赖包 npm i element-ui -S 2、在main.js中导入element-ui相关资源 // 手动配置element-ui import ElementUI from‘element-ui‘ import ‘element-ui/lib/theme-chalk/index.css‘ Vue.use(ElementUI) 3、可以在vue页面使用element-ui组件了// 手动配置element-uiimport ElementUI from ‘element-ui‘import ‘element-ui/lib/theme-chalk/index.css‘Vue.use(ElementUI)原文：https://ww...
前面介绍了很多关于ABP框架的后台Web API 服务端，以及基于Vue+Element前端应用，本篇针对两者的联合部署，以及对部署中遇到的问题进行处理。ABP框架的后端是基于.net core5.0 的Asp.net core 应用，因此和常规的Asp.net core 应用部署一样；而Vue+Element前端应用则是基于nodejs的应用，部署方式又有所不同，这里介绍基于Nginx的部署。1、部署基于.netcore5.0的ABP框架后台Api服务端1）安装.net core 环境在部署asp.net core服务前...
项目介绍 JavaWeb_Vue是基于 SpringBoot2+Vue+element-ui+Shiro+MybatisPlus 研发的权限(RBAC)及内容管理系统，致力于做更简洁的后台管理框架，包含系统管理、代码生成、权限管理、站点、广告、布局、字段、配置等一系列常用的模块，整套系统一键生成所有模块（包括前端UI），一键实现CRUD，简化了传统手动抒写重复性代码的工作。 同时，框架提供长大量常规组件，如上传单图、上传多图、上传文件、下拉选择、复选框按钮、单选按钮，...
好不容易弄个博客不知道写啥，随便找了个文档试下效果。。。。1.安装nodenode下载地址:https://nodejs.org/zh-cn/download/node安装会默认装好npm 检验node，npm安装成功否node -vnpm -v 2.安装淘宝镜像（cnpm）npm install cnpm -g --registry=https://registry.npm.taobao.org检验cnpm安装成功否cnpm -v 3.安装Vue脚手架：vue-cli ① 安装webpack：cnpm install webpack -g或者（cnpm install -g webpack） 注意：webpa...
基于Vue的Ui框架 饿了么公司基于vue开的的vue的Ui组件库 Element Ui 基于vue pc端的UI框架 http://element.eleme.io/ MintUi 基于vue 移动端的ui框架http://mint-ui.github.io/#!/enmintUI的使用： 1.找官网 2.安装 npm install mint-ui -S -S表示 --save 3.引入mint Ui的css 和 插件 import Mint from ‘mint-ui‘; Vue.use(Mint); import ‘mint-ui/lib/style.css‘ 4.看文档直接使用。 在mintUi组...
本文来自网易云社区。前瞻当前前端界空前繁荣，各种框架横空出世，包括各类mvvm框架横行霸道，比如Angular、Regular、Vue、React等等，它们最大的优点就是可以实现数据绑定，再也不需要手动进行DOM操作了，它们实现的原理也基本上是脏检查或数据劫持。那么本文就以Vue框架出发，探索作者运用Object.defineProperty来实现数据劫持的奥秘（本文所选取的相关代码源自于Vue v2.0.3版本的源码）。回顾一下Object.defineProperty语法 Ob...
一、什么是VUE？ 它是一个构建用户界面的JAVASCRIPt框架 vue不关心你页面上的是什么标签，它操作的是变量或属性为什么要使用VUE？ 在前后端分离的时候，后端只返回json数据，再没有render方法，前端发送ajax请求（api=url）得到数据后，要在页面渲染数据，如果你js+css实现就太麻烦了，这时候VUE就出现了。二、怎么样使用VUE1）引入vue.js<script src=vue.js></script> 2) 展示html<div id="app"><input type="text" v...
选中radio或者checkbox需要注意的是：不管<input type=‘radio checked=‘true‘‘> 你的checked属性值是true或者false，他都会选中。选中不选中，不是看checked的属性值，而是看有没有checked这个属性，所以，动态选中，不用v-model,也不用checked=‘true‘，只需要判断渲染checked这个属性就好了.不多说了，直接上代码<div v-for="(item,index) in product_test"><input name="Fruit" class="input-fruit" :checked="product_te...
前景提要： 由于想要使用nunjucks引擎动态通过直接引入js文件的形式来进行项目的结构搭建，但是由此也有一些问题。由于项目开发时需要开启俩个server，一个是webpack的微服务、另一个是node服务端。我们请求node服务，返回nunjucks模板引擎处理后的html文件。开发环境下可以直接引入script来进行js文件以及使用link 进行css文件的获取。但是开发环境下出现hash值。如果不使用不使用hash值可能会导致某些浏览器缓存了该js文件就导致...