vue学习笔记2——部分词名及一些定义的理解

vue学习笔记2——部分词名及一些定义的理解
在一般的.vue文件中
<template>标签中写html，此标签中第一级别的标签只能有一个如下图只有footer，其余的都写在footer中

export default 用来导出，其他文件可以用import来引入

export default和export的区别是 前者只能导出一个 ，后者可以导出若干个（但是我一般只使用export default）

一般都是导出一个组件。然后去父组件中定义引入就能使用。

我的理解就是在<script> 中用export default定义完成后并，给其他文件要调用的时候，给的接口。（别人教我，这个叫暴露接口）
如下图在父组件中的定义

在父组件.vue文件中的有用import引入刚才定义的组件（子组件），其中@在脚手架中被定义为src目录；再在父组件的export default中的 components中定义引用的组件名称，方便在父组件中根据你定义的名称直接使用，注意，在定义名称（引用时候的标签名，我是这么理解的）的时候，要避开一些关键词和保留词，比如：footer，nav，header等。

在父组件的template 中用过刚才的引用调用定义好的子组件标签名

比如：<end> 此时指向的是子组件footer

<router-view></router-view>标签，网上说是页面的组件渲染

目前在我接触的demo中，基本都只有一个router-view标签

router-link可以实现重定向，可以实现路由的直接跳转，下面为两种路径指向方法：
<router-link to="{path: '/login'}">login</router-link>
<router-link to='/home/home1'>to home1</router-link>
路由重定向，可以理解为，在当前路由指向其他路由，一般在路由嵌套中使用较多

关于路由和component的之间的一些关系

router和components具体参见构建图（此图是网上找的）

router主要存放页面和子页面（抽象理解，地址栏的ip后的字串，每一个 / 分隔的可以理解为一个路由或是子路由）

components主要存放一些结构，全局，功能插件，文字，动画插件等js插件

注意：

一般情况路由不能平级

后面还会谈及路由一些的配置等问题，此处带过

<div id="app"></div>

在最外层的index.html中，我把这个理解为根节点，在vue里面任何的添加都在#app里面

一般不设置与#app平级的div

vue学习笔记，是根据网上的一些帖子，自己在学习过程中实际情况，总结而来。每个人在学习过程中和实际操作中是有明显的个体差异的。本文仅作参考使用。