Vue随笔记录
一、创建Vue步骤(VS Code)
1、全局安装
npm install -g vue-cli
2、新建项目
vue init webpack "project-name"
3、安装依赖
npm i
4、运行
npm run dev
二、Vue架构
1)、记住“三个位置”:
1、router-->index.js(存放路由、路由组件、路由页面路径等)
注:此项目默认路径是“/”。在path下一行加入(redirect:“/test”),则项目默认路径为“/test”,即可显示HelloWorld.vue内容。

2、新建的Home.vue文件(包含Header组件、Footer组件、Sider组件、路由页面【router-view】,其中router-view组件是动态的,来自router-->index.js文件中路由引入的组件,本例中,router-view组件指的是HelloWorld.vue,地址是“/test”)

3、components或其他文件下的vue文件(即视图文件)

2)、架构“两个要点”:
1、布局写在Home.vue文件里面
2、在index.js文件里面配置路由,每一个router配置应该包含:引入Home.vue组件的名称,和显示router-view的组件路径。
Vue随笔记录的更多相关文章
- MapXtreme 随笔记录1
最近在用MapXtreme做项目,随笔记录备忘. 声明:PubMapPara 静态类,后缀为静态类成员变量 1.加载地图 /// <summary> /// 地图工作空间文件路径 /// ...
- Vue 问题记录
Vue 问题记录 汇总日常开发中遇到的关于vue的问题 VeeValidator 语言设置 校验消息默认是英文的,定义中文或其他语言的错误提示消息 import VeeValidate from 'v ...
- Hello vue.js的随笔记录
数据双向绑定的script在组件定义位置后面才顶用. 使用它的话,引用js就好,比较简单. 声明一个vm对象,new Vue({}).这个构造里传一个对象,包含el:界面元素,data:数据,meth ...
- Vue学习记录第一篇——Vue入门基础
前面的话 Vue中文文档写得很好,界面清爽,内容翔实.但文档毕竟不是教程,文档一上来出现了大量的新概念,对于新手而言,并不友好.个人还是比较喜欢类似于<JS高级程序设计>的风格,从浅入深, ...
- vue实战记录(五)- vue实现购物车功能之商品总金额计算和单选全选删除功能
vue实战,一步步实现vue购物车功能的过程记录,课程与素材来自慕课网,自己搭建了express本地服务器来请求数据 作者:狐狸家的鱼 本文链接:vue实战-实现购物车功能(五) GitHub:sue ...
- vue实战记录(六)- vue实现购物车功能之地址列表选配
vue实战,一步步实现vue购物车功能的过程记录,课程与素材来自慕课网,自己搭建了express本地服务器来请求数据 作者:狐狸家的鱼 本文链接:vue实战-实现购物车功能(六) GitHub:sue ...
- vue实战记录(四)- vue实现购物车功能之过滤器的使用
vue实战,一步步实现vue购物车功能的过程记录,课程与素材来自慕课网,自己搭建了express本地服务器来请求数据 作者:狐狸家的鱼 本文链接:vue实战-实现购物车功能(四) GitHub:sue ...
- vue实战记录(三)- vue实现购物车功能之渲染商品列表
vue实战,一步步实现vue购物车功能的过程记录,课程与素材来自慕课网,自己搭建了express本地服务器来请求数据 作者:狐狸家的鱼 本文链接:vue实战-实现购物车功能(三) GitHub:sue ...
- vue实战记录(二)- vue实现购物车功能之创建vue实例
vue实战,一步步实现vue购物车功能的过程记录,课程与素材来自慕课网,自己搭建了express本地服务器来请求数据 作者:狐狸家的鱼 本文链接:vue实战-实现购物车功能(二) GitHub:sue ...
随机推荐
- 2018-2019-2 20175236实验二《Java面向对象程序设计》实验报告
实验内容 初步掌握单元测试和TDD 理解并掌握面向对象三要素:封装.继承.多态 初步掌握UML建模 熟悉S.O.L.I.D原则 了解设计模式 实验要求 没有Linux基础的同学建议先学习<Lin ...
- note 8 字符串
字符串String 一个字符的序列 使用成对的单引号或双引号括起来 或者三引号""" 和 ''' 表示块注释 字符串运算 长度 len()函数 first_name = ...
- okhttp 解析respone:
android,retrofit,okhttp,日志拦截器,使用拦截器Interceptor统一打印请求与响应的json: https://blog.csdn.net/qq_37043246/arti ...
- The usage of docker image wurstmeister/kafka
The docker image wurstmeister/kafka is the most stared image for kafka in hub.docker.com, but the us ...
- java 字节编码学习
位开始,连续的二进制位值为1的个数决定了其编码的位数,其余各字节均以10开头.UTF-8最多可用到6个字节. 如表: 1字节 0xxxxxxx 2字节 110xxxxx 10xxxxxx 3字节 11 ...
- Java进程&线程(一)
Java进程&线程 程序:程序员写的代码,就是代码,不运行好像不会发生什么: 进程:一个进程可以理解为"运行的"一个程序,当我们启动一个java程序后,对应的jvm就会创建 ...
- SQLServer 2008 已成功与服务器建立连接,但是在登录前的握手期间发生错误。 (provider: SSL Provider, error: 0 - 等待的操作过时。
在用SQL Server 2008 在连接其他电脑的实例时,一直提示“已成功与服务器建立连接,但是在登录前的握手期间发生错误. (provider: SSL Provider, error: 0 - ...
- 001.[python学习]写在前面的
0.多动手写写也许你所说的问题就不是问题: 1.最好的帮助文档是dir和help,如下图: 2.如果为了快速完成任务可以选择IDE,否则尽量不要依赖它,因为它的智能导致自己的无能: 3.也许有其他语言 ...
- 验证demo
// chenwenjun.cpp : 定义控制台应用程序的入口点.//#include "stdafx.h"#include <iostream>#include & ...
- python3下最简单的九九乘法表
def minus(): print("=========================九九乘法表===========================") x=1 y=1 wh ...