自我笔记和理解

day 01

1.markdown语法

• # 代表 一级标题 以此类推

• ``` 代表 Java sacrpt 的 语法

• 两 * 代表加粗字体

• 两 * 和 Eglishi** 代表单词

• 无序列表 是一个*

• 有序列表 1. 2. 3. 以此类推

• ' > ' 代表 引入文字

• 代表 引入图片

• 引入网址 [网站的名称] (网站的路径)

2.什么是MVVM

• MVC：是后台的框架模式 分为M：（model模型）、V（view视图）、C（controller控制器）

• MVVM是为了实现MVC中的V MVVM分为：M（model数据）、V（view视图）、VM（viewModel控制数据的改变和控制视图）

3.vue 脚手架的安装

• npm 和 cnpm 的区别

• 1. npm : node package manager

  2. cnpm : china node package manager

• 1.查看node 版本号 如果低于 版本10 的话安装最新版node

  如果没有cnpm 的话 需要安装cnpm 如果已经安装过cnpm 可以跳过 安装cnpm的命令是： npm install -g cnpm --registry=https://registry.npm.taobao.org

• 2.cmd终端中安装vue脚手架 cnpm i @vue/cli -g 安装成功后可以执行 vue -V (注意：-V 是大写) 查看vue版本号 来检测是否成功

• 3.创建项目： 在想要创建项目的文件夹中打开终端，执行 vue create demo （demo是要创建的项目的名称）

  如果出现如下界面 输入y 意思是问你要不要使用淘宝镜像，没有这个界面的话执行下一步就行

  选界面

  • 1.第一次创建项目需要手动选择项目配置 上下键进行切换 按回车键执行下一步

  • 2.第二个界面 按如下 用空格键进行选择，用上下键切换意思是 选择项目的配置和功能

  • 3.第三个界面 选择vue的版本 我们要选择第二个版本

  • 4.第四个界面 问你选择的路由的模式 输入n 按回车下一步就行

  • 5.第五个界面 选择如下

  • 6.第六个界面 意思是问你 把配置文件分开放还是 放在一起

  • 7.第七个界面：是不是要把你刚才的配置存下来 并且起一个名字 ，下次再次执行 vue create xxx命令创建项目的时候就可以直接使用这个保存下来的模版了

  • 8.第八个界面：项目创建成功 执行 提示的两个命令（cd xxx 和npm run serve）就可以开启vue的项目啦

  4.vue 中的项目结构

  • ** node_modules** 代表下载的依赖包

  • ** public** 存放html

  • ** src** 存放源代码

  • ** assets** 静态资源

  • ** compoments**组件

5.什么是组件

• 在写项目的过程中会有很多重复的html片段 这个时候就可以封装一个子组件，这个子组件可以重复使用 我们可以把子组件理解为封装的html片段 子组件是页面的一部分

6.引入组件

• 1.先创建一个组件 以 .vue 结尾

• 2.在哪里用到，就在哪个页面去引入 import xx from '路径'

• 3.注册 注册 在components:{ xx: xx 简写为： xx} 是选项对象 和data、methods同级

• 4.拿到注册的名字，当做标签来使用 单双标签都可以 <xx></xx> <xx/>

7.父组件 向 子组件 传值

• 父组件中 在子组件的标签上绑定一个自定义属性 <xx :aa="msg"></xx> 子组件 在子组件中 通过props:["aa"]来接收值, aa 就是自定义的属性名 props 也是应该选项对象 和data、methods同级 props 是单向数据流

8.子组件 向 父组件 传值

• 把子组件的数据传递到父组件 本质就是 父组件把【方法】传递给子，子组件调用父方法的时候（this.$emit("aa")）,把数据作为参数传递给父组件

• 第一步： 先把父组件的事件， 通过自定义事件传递到子组件 <xx @aa="fn"></xx>

• 第二步： 在子组件中用 this.$emit("aa") aa就是自定义事件名 这样就调用了fn方法

• 第三步： 在调用父组件方法的时候 this.$emit("aa", this.msg) 传递给 fn 的参数中 fn（val）{ val就是this.msg}