一.流程图效果 最近一段时间在研究go.js,它是一款前端开发画流程图的一个插件,也是一个难点,要说为什么是难点,首先,它是依赖画布canvas知识开发.其次,要依赖于内部API开发需求,开发项目需求的时候就要花费大量的时间去熟悉go.js的API,然后才能进行开发.话不多说,我就先把我最近做的项目案例效果图展示一下: 看到效果图大家可能会想这个挺简单的,会想没什么难点,其实真正开发的时候才会知道的.才会领悟到. 二.为什么选go.js流程图插件去开发项目? 在项目开发一期的时候我用的不是go.…
前言 最近由于公司需要,需要写一个相对来说比较大型的后台管理系统.为了保证管理系统操作体验较为舒适并且项目后期益于维护,最后决定基于VUE全家桶来开发一个高度组件化的单页SPA应用. 技术选型 vue:进行数据绑定以及开发组件 vue-router: 处理页面路由 vuex: 处理各组件间的通讯 vue-resource:处理HTTP请求 element-ui:使用UI框架中部分UI组件进行快速开发 项目创建 首先我们需要保证自己电脑安装有Node运行环境 打开命令行工具,输入下面指令进行全局安…
基于Vue的前端框架有很多,这几年随着前端技术的官方应用,总有是学不完的前端知识在等着我们,一个人的精力也是有限,不可能一一掌握,不过我们学习很大程度都会靠兴趣驱动,或者目标导向,最终是可以以点破面,逐步掌握各种前端知识的.本篇随笔主要以实际应用场景为例介绍一些Vue前端技术的拓展,供大家参考学习.…
github地址:https://github.com/MengFangui/VueTabSwitch 1.index.html <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8" /> <title>基于Vue开发的标签页组件</title> <link rel="stylesheet" type…
前面的话 不论是官网教程,还是官方DEMO,都是从0开始的服务端渲染配置.对于现有项目的服务器端渲染SSR改造,特别是基于vue cli生成的项目,没有特别提及.本文就小火柴的前端小站这个前台项目进行SSR改造 效果 下面是经过SSR改造后的前端小站xiaohuochai.cc的网站效果,github源码地址 概述 [定义] 服务器渲染的Vue应用程序被认为是"同构"或"通用",因为应用程序的大部分代码都可以在服务器和客户端上运行 [优点] 与传统SPA相比,服务器…
最近,在公司给一些刚刚使用vue进行开发的同学做了一次分享, 其中包括一些vue开发中需要注意的点, 以及一些可能会踩到的坑.具体内容如下: 一.生命钩子使用需要注意的地方 1.beforeCreate文档描述:在实例初始化之后,数据观测 (data observer) 和 event/watcher 事件配置之前被调用.注意: 在这个钩子上,this变量还不能使用,data里的属性,methods方法里的方法,watcher中的事件都无法获得:2.created文档描述:在实例创建完成后被立即…
最近做vue做项目碰到了不少坑,看了三天文档便开始上手做项目了,不是我牛b,是因为项目紧,我没有时间去深入学习,所以只能一边学一边做了. 我要做的项目是一个官方网站(包括管理后台),也因为是我第一次使用vue,所以碰到的问题特别多,我写这个文章就是为了记录一下我做这个项目碰到的一些问题,其次大家有碰到相同问题的也可以参考一下,废话不多说了,直接开始吧. 1.安装node.js 首先要搭建vue的环境需要借助node.js的npm的包管理器,所以第一步就是安装node.js和配置node.js环境…
己基于vue写了一个 Mplayer, github地址:https://github.com/xiangwenhu/MPlaer, 演示地址:http://babydairy2017.cloudapp.net:3000/index#/index 只有简单的搜索播放随心听功能,样式适配上也很差, 路由就两个,数据都走vuex,数据转发是用nodejs自己转发,而且只是PC能比较好的展现,之后不了了之,偶尔也自己上来听听歌曲. 有一天,抬头看,有一片云,特别的蓝,风一吹,一阵花香飘来,美好,美好的…
本文的目标是通过下文介绍的适配方案,使用vue或react开发移动端及H5的时候,不需要再关心移动设备的大小,只需要按照固定设计稿的px值布局,提升开发效率. 下文给出了本人分别使用create-react-app搭建的react(create-react-app)项目和使用vue-cli 2.x 搭建的vue项目中的 亲测可用 配置方案. px2rem或postcss-px2rem 在移动端中,为了设配不同的设备,通常使用rem来做适配. rem是通过根元素进行适配的,网页中的根元素指的是<h…
只记录vue项目开发流程,不说明怎样安装node和vue-cli等 确认安装 安装好node之后,可查看是否安装成功,有版本则安装成功.输入node -v 查看vue是否安装成功,有版本则安装成功.输入vue -V(注意V大写) 开始新建项目 vue init webpack vueproject插入一个工程 "init" 这个命令用于创建一个 package.json 选择上面列表中的 webpack 方式 "vueproject" 只是起的一个名字 ? Proj…