31 vue入门
本专辑讲述vue
张力的程序园
兰州大学毕业,10多年软件开发经验,善于系统性设计多种技术映射到问题解决空间。java出身,精通设计模式,熟悉经典算法,主要从事方向为分布式和大数据研发,对高并发、大流量设计思想有深刻理解和运用。
展开
-
12 nuxt客户端渲染之路由
上一节我们完成了使用vue脚手架创建了nuxt的第一个demo,这一节我们熟悉一下nuxt中的路由。1、前提约束完成nuxt的第一个demo,假设名称为nuxt-demohttps://www.jianshu.com/p/a931b7ba89352、普通路由2.1 在nuxt-demo/pages文件夹下创建student.vue<template>...原创 2020-03-01 17:29:49 · 376 阅读 · 0 评论 -
11 nuxt客户端渲染之helloworld
1、前提约束完成nodejs,vue-cli,webpack,webpack-dev-server的安装https://www.jianshu.com/p/eb4d9e132f622、操作步骤创建项目:# 执行此命令,一路回车vue init nuxt/starter nuxt-demo# 进入项目路径cd nuxt-demo# 下载依赖包cnpm i...原创 2020-03-01 15:33:52 · 65 阅读 · 0 评论 -
10 element-ui展示tree
1、前提约束完成nodejs,vue-cli,webpack,webpack-dev-server的安装https://www.jianshu.com/p/eb4d9e132f62提供一个后台api可以完成文件上传https://www.jianshu.com/p/2262beb31378假设提供文件上传的api路径为:POST http://localhost:80...原创 2020-02-25 14:19:52 · 137 阅读 · 0 评论 -
09 element-ui完成文件上传
1、前提约束完成nodejs,vue-cli,webpack,webpack-dev-server的安装https://www.jianshu.com/p/eb4d9e132f62提供一个后台api可以完成文件上传https://www.jianshu.com/p/2262beb31378假设提供文件上传的api路径为:POST http://localhost:80...原创 2020-02-24 22:05:07 · 544 阅读 · 0 评论 -
08 vue项目中加入element-ui显示表格
本节我们将通过easytable显示数据。1、前提约束完成nodejs,vue-cli,webpack,webpack-dev-server的安装https://www.jianshu.com/p/eb4d9e132f622、操作步骤使用脚手架创建一个vue项目模板并启动成功,假设项目名称为vue-elementhttps://www.jianshu.com/p/64...原创 2020-02-18 14:54:18 · 198 阅读 · 0 评论 -
07 nodejs+mysql向外提供api
本节我们将通过nodejs+mysql为向外提供api,完成07小节中接口的提供。1、前提约束完成nodejs,vue-cli,webpack,webpack-dev-server的安装https://www.jianshu.com/p/eb4d9e132f622、操作步骤创建一个文件夹作为项目文件夹mkdir nodejsmysql下载相关包cd nod...原创 2020-02-18 16:25:05 · 297 阅读 · 0 评论 -
06 vue中使用axios跨域
本节将展示如果通过axios+proxyTable完成跨域请求并显示数据。1、前提约束完成nodejs,vue-cli,webpack,webpack-dev-server的安装https://www.jianshu.com/p/eb4d9e132f622、操作步骤完成vue项目中加入easytable【这时是固定数据】https://www.jianshu.com/...原创 2020-02-18 15:35:58 · 83 阅读 · 0 评论 -
05 vue项目中加入easytable
本节我们将通过easytable显示数据。1、前提约束完成nodejs,vue-cli,webpack,webpack-dev-server的安装https://www.jianshu.com/p/eb4d9e132f622、操作步骤使用脚手架创建一个vue项目模板并启动成功,假设项目名称为vue-easytablehttps://www.jianshu.com/p/...原创 2020-02-18 14:39:40 · 459 阅读 · 0 评论 -
04 使用脚手架创建vue项目并启动
在安装了相关工具之后,我们现在就可以创建一个分模块的vue项目了。1、前提约束完成nodejs,vue-cli,webpack,webpack-dev-server的安装https://www.jianshu.com/p/eb4d9e132f622、打开命令行,执行以下命令vue init webpack vue-multymodule 回车,等待几分钟【取决于网络】...原创 2019-10-29 18:14:51 · 336 阅读 · 0 评论 -
03 手动创建vue项目完成加法运算
在安装了相关工具之后,我们现在就可以创建一个分模块的vue项目了。1、前提约束完成nodejs,vue-cli,webpack,webpack-dev-server的安装https://www.jianshu.com/p/eb4d9e132f622、操作步骤打开命令行,执行以下命令,创建项目# 进入到桌面cd C:\Users\zhangli\Desktop# ...原创 2020-02-16 12:09:11 · 256 阅读 · 0 评论 -
02 安装nodejs、vue-cli、webpack、webpack-dev-server
Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境,运行在服务器端。nodejs所携带的npm包管理命令可以方便的安装vue-cli, webpack, webpack-dev-server等命令,而这些命令是创建或者运行vue项目的基础。1、安装nodejs在http://nodejs.cn/download/下载nodejs的windo...原创 2019-10-29 17:21:00 · 174 阅读 · 0 评论 -
01 第一个vue demo
vue是一个前端框架,类似的技术还有angular js以及react。本专辑将介绍vue的基本用法,我们先看vue的一个demo。1、环境约束记事本2、打开nodepad,将以下内容拷贝进入,保存为index.html<!DOCTYPE html><html><head> <meta charset="gbk"&g...原创 2019-10-29 15:47:23 · 95 阅读 · 0 评论