vue基础(vue基础语法)

1导入开发版本的vueis 2创建vue实例对象，设置el属性和data属性 3使用简介的模版语法把数据渲染到页面上 vue实例可以使用双标签挂载，不能使用HTML和BODy来进行 vtext 设置标签的文本值 覆盖标签中全部的内容。

1HTMLCSS和JS基础 2了解Node和npm 3webpack可选，vuecli已经封装了打包功能使用Vue的两种方式1直接script标签引入vuejs文件 2基于Node环境创建Vue项目使用vuecli初始化一个Vue项目前端框架与库的区别。

Vue的两种挂载方式模板语法1插值表达式 存在闪动问题快速刷新浏览器时，有时会显示xxx内容，然后替换为要显示的值解决的办法指令先隐藏，替换好值之后再显示2指令指令的本身就是自定义属性以v开头 例。

1vfor可以理解为for#160in，遍历数组返回给item，数组有多少内容就有多少个item，并自动生成html标签 2von绑定事件，语法=von事件类型#160=#160quot函数调用quot，调用的函数定义在methods中，vue。

基础知识vue的生命周期 beforeCreatecreated beforeMountmounted beforeUpdateupdated beforeDestorydestoryed vue常用指令 vfor vbind缩写形式 prop von缩写形式 @click=’sss#39 vifv。

msgquot欢迎学习vuequot， * flagfalse， * flag1false， str1#39#39 ， * 定义写方法的地方 * methods fnfunctionstr alertstr ， fn1function let str = windowprompt#39选择你喜欢的语言#39 * 使用th。

指令Directives，是vue为开发者提供的 模板语法 ，用于辅助开发者渲染页面的基本结构 所用到的数据定义在实例的 data 中，事件定义在实例的 methods 中 只能渲染纯文本内容， 会覆盖 标签内部原本的内容 只能。

vslot指令是Vue26中用于替代slot属性的一个指令 在Vue26之前， 我们通过slot属性告诉Vue当前内容填充到哪一个具名插槽 从Vue26开始， 我们通过vslot指令告诉Vue当前内容填充到哪一个具名插槽 41什么是作用域插槽。

相比之下，每当触发重新渲染时，调用方法将总会再次执行函数 通常更好的做法是使用计算属性而不是命令式的 watch 回调Vue 将被侦听的数组的变更方法进行了包裹，所以它们也将会触发视图更新这些被包裹过的方法。

用于监听一个响应式变量带有__ob__的变化比如工作中，我们经常监听data计算属性vuex$route等的变化这个侦听器watch，是vue组件的一个选项，不是响应式原理中Watcher 1虽然watch对象中放的是函数，但不能用。

vcloak 和 CSS 规则如 vcloak display 一起用时，这个指令可以隐藏未编译的 Mustache 标签直到组件实例准备完毕，主要用于解决闪动问题，现在Vue3一般不会出现这个问题了 不会显示，直到编译结束 前面讲的一系列指。

本节我们将介绍 Vue 的插件包括什么是插件如何使用插件如何编写一个简单的插件其中，编写和使用插件是本节的重点本节我们将带领大家写一个简单的插件示例，同学们在学完本节后可以尝试编写其他的插件来加深学习Vu。

类似组件可以全局注册和局部注册，使用 derective 注册指令定义函数提供了几个钩子函数可选钩子函数有以下参数在 render 函数中使用 this$slots 和 props 传递数据在render函数中使用 vmodel 在 render。

Vue 项目创建时候的一些基础配置小记CLI 即 @vuecli 全局安装的 npm 包用于终端提供 vue 相关的指令，可用来创建工程启动服务等CLI service 即 @vuecliservice 开发环境的依赖，构建于 webpack 和 webpackdev。

#8195#8195在上一章节中，我们了解了Vue中的常用指令，同样，在本章节中继续讲解Vue中常用的指令，并且这些指令是针对语句使用的 #8195#8195用于条件性的渲染一块内容，只有当条件的返回值为真时，才会渲染该块。

常用的PC端组件库有 elementui iView antdesign vue 常用的移动端组件库 Vant Mintui 注意 第三方组件库，必须在Vue的下面引入 效果注意 *非 templaterender 模式下，一些组件名在实际使。

vmodel 是 vue 提供的用来对表单控件做数据双向绑定的指令它可以根据用户的输入动态改变其绑定的值，同样可以根据绑定值的改变来操作页面 DOM 的更新3 基本用法接下来我们将详细介绍 vmodel 在不同表单元素上的使用。