使用vue-cli3创建一个项目 1) 使用Vue UI创建.管理项目 1.安装依赖的脚手架包. 2.命令行中输入vue ui 即可以打开可视化界面 可视化界面: 2)项目结构目录整理 3)基本配置 通过配置 DevServer 实现跨域…

路由详解(一)--基础: 1)router-link和router-view组件 2)路由配置 3)JS操作路由…

前两天又有小伙伴私信松哥,问题还是职业规划,Java 技术栈路线这种,实际上对于这一类问题我经常不太敢回答,每个人的情况都不太一样,而小伙伴也很少详细介绍自己的情况,大都是一两句话就把问题抛出来了,啥情况都不了解,就要指出一个方向,这实在是太难了. 因此今天我想从我学习 Spring Boot + Vue 这套技术栈的角度,来和大家聊一聊没有人指导,我是如何一步一步建立起自己的技术体系的. 线上大家看我经常写文章,线下我其实比较宅,跟人交流比较少,我也很少问别人职业规划或者技术规划这些问题,因为…

前言 作为一位 Vuer(vue开发者),如果还不会这个框架,那么你的 Vue 技术栈还没被点亮. Nuxt.js 是什么 Nuxt.js 官方介绍: Nuxt.js 是一个基于 Vue.js 的通用应用框架. 通过对客户端/服务端基础架构的抽象组织,Nuxt.js 主要关注的是应用的 UI渲染. 我们的目标是创建一个灵活的应用框架,你可以基于它初始化新项目的基础结构代码,或者在已有 Node.js 项目中使用 Nuxt.js. Nuxt.js 预设了利用 Vue.js 开发服务端渲染的应用所需…

浏览文章前 这一期,我分享给大家三点看源码的小技巧,这也是从别的大佬那总结的. 被反复使用的代码 这样的代码是一个软件的重点函数,一个大神的写法有很多精华值得学习. 穿越时间的代码 如果一段代码10年甚至15年,都还在使用.说明它的设计思想一定很棒. 好调试的代码 一个程序的代码很容易就调试成功,说明作者的项目结构能力很强,值得学习. 前言 今天,我们来搞一个新东西,名字叫基于Vue技术栈的全栈热重载生产环境脚手架.实话说,这个名字我想了很久.最终,还是以这个名字作为文章标题.我先拆分解释下:全…

1.确认是否由安装由vue 命令提示符 执行 vue -V 如果没有则执行 npm uninstall vue-cli 2.创建项目 vue create demo1 具体操作如下: (1)执行以上命令后会提示,使用键盘上下箭头选择 选择之前配置好的模板,或者自定义 Manually select features 自定义配置(按方向键 ↓)(选择自定义) (2)上下键选择需要的选项按空格键即选中 1 ? Check the features needed for your project: (…

1 vue 说明:vue生命周期:技术点:1:常用的API:computed,methods,props,mounted,created,components 2vue-cli说明:vue绞手架,用于快速搭建项目,并管理项目技术点: 3vue-router说明:路由技术点: 4 axios/vue-resource或最新的fetch说明:ajax请求技术点: 5 vuex说明:状态管理,用于统一管理状态技术点:state,getter,mutation,action 6UI方面: element…

今天整理文档突然发现了一份md文档,打开一看 瞬间想起当年学习vue的艰难路,没人指导全靠自己蒙,下面就是md文档内容,需要的小伙伴可以打开个在线的md编译器看一看,我相信不管是新人还是老人  入门总是可以的(这只是初学时候做的笔记,如果有哪里写错了还望联系我修改,免得误导其他新人,本人qq:421217189) # vuex ##### 五大模块: ## state 数据 ``` 在vuex中调用:state.xxx; 组件内使用:this.$store.state.xxxx mapstate…

前言 activiti工作流,企业erp.oa.hr.crm等审批系统轻松落地,请假审批demo从流程绘制到审批结束实例. 一.项目形式 springboot+vue+activiti集成了activiti在线编辑器,快速开发平台,可插拔工作流服务. 二.项目介绍 本项目拥有用户管理,部门管理,代码生成,系统监管,报表,大屏展示,业务审批等功能.功能太强大,只能粗矿的介绍,所见即所得,体验一下吧. 三.工作流 1.流程模型绘制 进入流程模型菜单,创建流程模型,这里涉及到网关流转,需要设置流转条件…

昨日内容回顾 0. 组件注意事项!!! data属性必须是一个函数! 1. 注册全局组件 Vue.component('组件名',{ template: `` }) var app = new Vue({ el: '#app' }) 2. 注册局部组件 var app = new Vue({ el: '#app', components:{ 局部组件名:{ template: `...` } } }) 3. 传值 1. 父组件 --> 子组件 1. 父组件通过 v-bind:变量='值' 2.…

前言 本文是自己vue项目实践中的一些总结,针对Vue2及相关技术栈,实践中版本为2.3.3. 开发前须知 vue-cli 在开发前,我们要至少通读一遍vue官方文档和API(看官方文档是最重要的,胜过看五十.一百篇博客),英文阅读能力还行的建议阅读英文文档,中文文档内容会稍落后,还要通读相关的vue-router.axios.vuex等. 一般来说我们都是先利用vue-cli来搭建项目基本架构. vue-cli官方temaplte地址,我们选择webpack版本,建议看看其文档vue-webp…

前言 上家公司的项目主要是使用jQuery和Angular1,然后自己学了React,没想到来到这家公司突然开始做vue,不过vue还是挺容易上手的.下面是vue技术栈的一些总结,都是来自官网,主要是自己对vue技术栈知识点的一些整理,因此此文很水,建议阅读我的上一篇文章Vuejs技术栈从CLI到打包上线实战全解析 Vue 独立构建和运行时构建 有两种构建方式,独立构建和运行构建.它们的区别在于前者包含模板编译器而后者不包含. 模板编译器的职责是将模板字符串编译为纯JavaScript的渲染函数…

前言 不知何时突然冒出“MEAN技术栈”这个新词,听起来很牛逼的样子,其实就是我们已经熟悉了的近两年在前端比较流行的技术,mongodb.express.angularjs.nodejs,由于这几项技术涵盖了从前端到后端再到数据库,可以用他们完整的开发一个web应用了,所以成了一个非常牛逼的组合,颇有当年LAMP的气势.前端要从切图仔迈向全栈的路上,这几门技术必须得有所涉猎.本系列文章利用自己虚构的一个小项目为例,对“使用MEAN技术栈开发web应用”做一个入门级的介绍.   AngularJs…

Vue Cli项目搭建     vue项目需要自建服务器:node 什么是node: 用C++语言编写,用来运行JavaScript语言 node可以为前端项目提供server (包含了socket) 一.环境搭建 1.官网下载安装包,傻瓜式安装:https://nodejs.org/zh-cn/ 2.装完了后在cmd输入node即可启动一个命令行交互环境,运行javascript代码 3.可以更换国内源,加速下载:npm install -g cnpm --registry=https://r…

本项目是基于慕课网的Spring Security技术栈开发企业级认证与授权,采用IDEA开发,本文章用来记录该项目的学习过程. 慕课网视频:https://coding.imooc.com/class/134.html 一.项目结构 newbe-security是父类,打包方式是pom,其余都是子模块,打包方式jar. 项目模块介绍: 二.项目依赖 2.1newbe-security父类依赖 <?xml version="1.0" encoding="UTF-8&qu…

vue2 + vuex + vue-router + webpack + ES6/7 + less + element-ui 1:vuex: Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式:  让我们从一个简单的 Vue 计数应用开始: new Vue({ // state data () { return { count: 0 } }, // view template: ` <div>{{ count }}</div> `, // actions methods…

第一章 建议学习时间8小时·分两次学习      总项目预计10章 学习方式:详细阅读,并手动实现相关代码(如果没有node和vue基础,请学习前面的vue和node基础博客[共10章]) 视频教程地址:www.lalalaweb.com,随博客进度会上传教学视频,大家可前往视频学习(暂时还没有) 演示地址:后台:demoback.lalalaweb.com  前台:demo.lalalaweb.com 后台权限是开放的,大家一定不要删除admin用户或修改密码,不然别人就无法登录了,演示过程中…

全栈的自我修养: 环境搭建 Not all those who wander are lost. 彷徨者并非都迷失方向. Table of Contents @ 目录 前言 环境准备 nodejs vue-cli 创建 Vue 项目 yarn和npm 命令 对照表 项目结构 使用 elementUI 配置 Vuex 配置 axios github 参考 当你看到这篇文章的时候,暂且认为你对如何做一个网站有了兴趣. 前言 本系列文章将从一个完整的项目是如何开发的过程进行编写,期间会涉及前端.后端和…

一.Vue教程 vue.js是一套构建用户界面的渐进式框架.vue采用自底向上增量开发的设计.vue的核心库只关心视图层,非常容易学习,非常容易与其它库和已有项目整合.vue完全有能力驱动采用单文件组件和vue生态系统支持的库开发的复杂单页应用.vue.js的目标是通过尽可能简单的API实现响应的数据绑定和组合的视图组件. 这里介绍一些我学习vue时用的教程. 1.入门教程 官网教程:https://cn.vuejs.org/v2/guide/ vue.js的官网教程是很全面的,包括文档和视频.…

如何优雅的使用vue+vux开发app -01 很明显下面是个错误的示范: <!DOCTYPE html> <html> <head> <title>vue-vux</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <!--include Vux style--> <link…

实用框架以及工具 UI组件 开发框架 实用库 服务端 辅助工具 应用实例 Demo示例 UI组件 Element-UI ★13489 - 饿了么出品的Vue2的web UI工具套件 Vux ★8133 - 基于Vue和WeUI的组件库 iview ★6634 - 基于 Vuejs 的开源 UI 组件库 mint-ui ★6253 - Vue 2的移动UI元素 muse-ui ★3705 - 三端样式一致的响应式 UI 库 vue-material ★3328 - 通过Vue Material和V…

注意:Vue CLI需要Node.js版本8.9或更高版本(建议使用8.11.0+). 查看node版本:node -v  , 查看npm 版本  npm -v, 1.首先需要安装node.js环境 2.如果在vue-cli全局安装了以前的(1.x或2.x)软件包,则需要先使用npm uninstall vue-cli -g或卸载它yarn global remove vue-cli. 3.使用以下命令行安装cli3  1.npm install -g @vue/cli     2.npm in…

前言 Vue版本说明:本文档编写时,Vue稳定版本为 2.6.10 本文档编写目的为:整理Vue相关生态的技术点.和开发中经常使用到的技术点,让开发者快速上手开发,提升开发效率 一,Vue开发工具:本人使用Hubilder X开发工具(Vue特别赞助商 ),选择合适自己的开发工具即可: 例如:vscode.WebStorm.sublimetext等任何文本工具都可进行开发 二,目录介绍: 1,Vue技术点整理-安装引入 2,Vue技术点整理 vue-devtools 3,Vue技术点整理-Vue…

一文速览Vue全栈 原创: 新哥Lewis 天道酬勤Lewis 7月7日 Vue 是一套用于构建用户界面的渐进式框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用,专注于声明式渲染视图层,结合丰富的生态系统和核心插件,致力于简单灵活快速驱动SPA.MPA等大小型应用. 本文依次介绍 双向数据绑定.计算属性.组件.事件机制.插件机制.前端路由.状态管理和服务端渲染等. 1. Vue实例与数据绑定 实例 Vue.js应用的创建很简单,通过构造函数 Vue 就可以创建一个 Vue 的根…

Node.js环境搭建 Node.js基于V8引擎,可以让js代码脱离浏览器运行 Vue CLI3.0 需要Node.js 8.9或者更高版本. 用nvm或者nvm-windows在同一台电脑中管理多个Node版本 nvm github地址:https://github.com/nvm-sh/nvm Vue CLI 3.0环境搭建 卸载老版本vue-cli:npm uninstall vue-cli -g 安装新版本:npm install -g @vue/cli 原型开发:npm instal…

最近有一些开发朋友问我应该怎样提升自己的能力,回想起来做了这么久 iOS 开发,我也有过那种“让我做一个功能实现个需求我会做,但接下来怎样提高我不知道.”的时期,这里尝试列一下 iOS 开发的相关技术,再说说在学习进阶上我的一些想法. iOS 技术栈 这里按我的理解给 iOS 相关技术分个类,以工程实现的角度,分成了基础.需求.效率.质量四个类别.基础指程序开发和 iOS 开发的基础知识和技能,需求就是产品的需求,有了基础技能,实现了产品需求后,剩下的事情就都是为了提高项目质量和提升开发效率.…

前言 此篇为进阶篇,希望读者有 Vue.js,Vue Router 的使用经验,并对 Vue.js 核心原理有简单了解: 不会大篇幅手撕源码,会贴最核心的源码,对应的官方仓库源码地址会放到超上,可以配合着看: 对应的源码版本是 3.5.3,也就是 Vue.js 2.x 对应的 Vue Router 最新版本: Vue Router 是标准写法,为了简单,下面会简称 router. 本文将用以下问题为线索展开讲 router 的原理: $router 和 $route 哪来的 router 怎样知…

本文的主要内容如下: 介绍vue-resource的特点 介绍vue-resource的基本使用方法 基于this.$http的增删查改示例 基于this.$resource的增删查改示例 基于inteceptor实现请求等待时的loading画面 基于inteceptor实现请求错误时的提示画面 本文11个示例的源码已放到GitHub,如果您觉得本篇内容不错,请点个赞,或在GitHub上加个星星! GitHub Source 本文的所有示例如下: http get示例 http jsonp示例…

VUE[version:2.4.1] Vue项目做了不少,最近在学习设计模式与Vue源码,记录一下自己的脚印!共勉!注:此处源码学习方式为先了解其大模块,从宏观再去到微观学习,以免一开始就研究细节然后出不来~ 从package.json文件知道我们在执行命令npm run dev(只是以dev为例prod一样) 对应的是config.js文件里面的web-full-dev,然后找到config.js文件 config.js 'web-full-dev': { entry: resolve('we…

阅读目录 Vue 的源码目录结构 预备知识 先捡软的捏 Angular 是 Google 亲儿子,React 是 Facebook 小正太,那咱为啥偏偏选择了 Vue 下手,一句话,Vue 是咱见过的最对脾气的 MVVM 框架.之前也使用过 knockout,angular,react 这些框架,但都没有让咱产生 follow 的冲动.直到见到 Vue,简直是一见钟情啊. Vue 的官方文档已经对 Vue 如何使用提供了最好的教程,建议 Vue 新手直接去官网学习,而不要在网上找些质量参差不齐的…