51dev.com IT技术开发者社区

51dev.com 技术开发者社区

如何搭建一个基于nuxt.js的项目

如何搭建一个基于nuxt.js的项目

介绍nuxt.js(中文官方文档)是vue.js的一个通用型应用框架,有了之前搭建vue项目的过程之后,搭建一个nuxt项目就会十分简单。搭建步骤1.打开命令提示符,进入到相关文件夹下;2.使用如下命令一步搭建项目vueinitnuxt-community/starter-templatetestP...

nuxt中全局引入element-ui

nuxt中全局引入element-ui

介绍对于一个前端小白来说,使用一套已有的框架作为基础,可以达到事半功倍的效果,在这里我们选择Element。Element,一套为开发者、设计师和产品经理准备的基于Vue2.0的桌面端组件库(官方文档中的叙述),下面我们将开始在之前搭建好的nuxt项目中引入element-ui。准备1.首先用web...

vue实现标签云效果

vue实现标签云效果

最近想给自己的博客上加上一个3D标签云的效果,用来表示自己博客文章的分组,网上找到了canvas实现的,还有a元素实现的解析3D标签云,我想让标签可以选择和点击,又不想在标签数量较多时操作a标签导致性能问题,于是svg就成了一个不错的选择。这里实现的核心主要是参考了前面的那篇解析3D标签云的文章,作...

vue学习笔记

vue学习笔记

一、安装, 需要安装node,npm,淘宝镜像cnpm,webpack,vue脚手架vue-cli下面是我的操作:nodewindow下升级到最新版本,去官网(https://nodejs.org/en/)下载最新稳定版本(v6.9.2)的.msi,替换到之前安装的node目录下,重新安装...

vue 生命周期理解

vue 生命周期理解

先上一张生命周期的图:8个生命周期:beforeCreate:组件实例刚被创建,组件属性计算之前created:组件实例创建完成,属性已绑定,但DOM还未生成,$el属性还不存在beforeMount:模板编译/挂载之前mounted:模板编译/挂载之后beforeUpdate:组件更新之前upda...

如何自己搭建一个vue脚手架工具

如何自己搭建一个vue脚手架工具

1.初始化项目目录 npminit(项目名称一定要规范否则会保存不能使用中文或者特殊符号)安装npmiwebpackvuevue-loader根据提示信息安装依赖npmicss-loadervue-template-compiler 2.新建文件夹(源目录)src在里面创建app...

vue项目post请求405报错解决办法

vue项目post请求405报错解决办法

步骤一:  确定ajax语法没有错误。步骤二:  与后台对接确认请求是否打到nginx上?步骤三:  检查nginx是否配置了事件转发,比如我们的接口是在,当前地址的8100端口上,并且接口地址上有v1这个唯一标识,按照下图配置,即可解决此问题。...

vue引入echarts、找不到的图表引入方法、图表中的点击事件

vue引入echarts、找不到的图表引入方法、图表中的点击事件

1.在vue-cli项目中添加webpack配置,本文引入的最新版本。在 3.1.1 版本之前ECharts在npm上的package是非官方维护的,从 3.1.1 开始由官方 EFE 维护npm上ECharts和zrender的packa...

Vue问题1:TypeError:date.getHours is not a function

Vue问题1:TypeError:date.getHours is not a function

再用vue的时间控件的时候遇到了如下的问题:解决方法:在<el-date-picker></el-date-picker>时间控件加上value-format="yyyy-MM-dd"以防出现date.getTimesisnotafunction以下的ap...

vue实现横向滚动效果(better-scroll)

vue实现横向滚动效果(better-scroll)

使用better-scroll实现滚动效果,参照大佬的文章,将better-scroll封装成组件可供多次调用。封装slider组件如何封装slider组件参考文档中解释的非常详细,但有一些细节可以提出。由于为横向滚动,首先需要一个宽度不变的wrapper,然后再制作一个较宽的content,con...

vue+axios上传文件

vue+axios上传文件

单独上传文件:<inputclass="file"name="file"type="file"accept="image/png,image/gif,image/jpeg"@change="update"/>methods:{update(e){letfile=e.target.file...

Vue-cli 记录

Vue-cli 记录

先给出能正确安装的步骤:1.进盘符2,为啥不用npm,这是国外的东西,有些电脑无法FQ,会导致安装失败,或者下载速度很慢345这是其中一步要填的,自己选择需要啥 问题:用npm安装带来的麻烦,看到了吗? 有种情况是8080端口被占,需要自己手动去设置...

Vue实战Vue-cli项目构建(Vue+webpack系列之一)

Vue实战Vue-cli项目构建(Vue+webpack系列之一)

用Vue比较长一段时间了,大大小小做了一些项目,最近想总结一下知识点,出一个Vue+webpack系列,先从项目构建说起——vue-cli.由于是Vue+webpack这里就不赘述git那些东西(用cmd也没问题),默认环境都配置好了。第一步先建立一个文件夹我这里是apron...

vue全家桶(Vue+Vue-router+Vuex+axios)(Vue+webpack项目实战系列之二)

vue全家桶(Vue+Vue-router+Vuex+axios)(Vue+webpack项目实战系列之二)

Vue有多优秀搭配全家桶做项目有多好之类的咱就不谈了,直奔主题。一、Vue  系列一已经用vue-cli搭建了Vue项目,此处就不赘述了。二、Vue-router  Vue的路由,先献上文档(https://router.vuejs.org/zh-cn/)。  路由在全家桶里面定位是什么呢,创建单页...

vue-router 之 keep-alive

vue-router 之 keep-alive

本文基于Vue2.0keep-alive 是Vue内置的一个组件,可以使被包含的组件保留状态,或避免重新渲染。用法也很简单:<keep-alive><component><!--该组件将被缓存!--></component></keep...