行动是治愈一切焦虑的良方

摘要： 在vue中可以通过ref获取dom元素，并操作它，还可以获取组件里面的数据和方法。 HTML部分： JS部分： 点击 ref 按钮，得到以下结果： 阅读全文

摘要： 子组件通过this.$emit("event",[args,....])，传值给父组件 HTML部分： JS部分： 结果： 阅读全文

摘要： 父组件通过属性，传值给子组件，子组件通过，props数组里的名称来接受父组件传过来的值。 HTML部分： JS部分： 注意：HTML 中的特性名是大小写不敏感的，所以浏览器会把所有大写字符解释为小写字符。这意味着当你使用 DOM 中的模板时，camelCase (驼峰命名法) 的 prop 名需要使 阅读全文

摘要： 一、组件命名的方式 ①kebab-case，单词之间采用 - （短横线）连接，例如：my-component ，在DOM中使用时，<my-component ></my-component > ②PascalCase，驼峰式名称，单词之间，首字母大写，例如：MyComponent，但是在DOM中使用 阅读全文

摘要： Vue 在插入、更新或者移除 DOM 时，提供多种不同方式的应用过渡效果。包括以下几种常见的方式： 在 CSS 过渡和动画中自动应用 class 可以配合使用第三方 CSS 动画库，如 Animate.css 在过渡钩子函数中使用 JavaScript 直接操作 DOM 在 CSS 过渡和动画中自动 阅读全文

摘要： 概念：vue的生命周期的几个过程 实例从创建之前（beforeCreate） 实例创建之后（created） 模板渲染之前（beforeMount） 模板渲染之后（mounted） 数据更新后，页面更新前（beforeUpdate） 数据和页面都更新后（updated） 实例销毁之前（beforeD 阅读全文

摘要： 说明：在vue中有v-bind、v-model等内置的指令，当我们想实现一些对DOM元素底层的操作时，在vue没有提供内置方法时，我们可以自定义一些内置的指令。 一、定义一个全局的自定义指令 案例：来实现一个，元素自动获取焦点的案例，元素渲染完了后，自动获取光标焦点。 JS部分： 调用，在标签内加个 阅读全文

摘要： 在监听键盘事件时，我们经常需要检查常见的键值。Vue 允许为 v-on 在监听键盘事件时添加按键修饰符： JS部分： HTML部分： 结果： Vue内置的按键名： .enter .tab .delete (捕获“删除”和“退格”键) .esc .space .up .down .left .righ 阅读全文

摘要： 定义：Vue.js 允许你自定义过滤器，可被用于一些常见的文本格式化。过滤器可以用在两个地方：双花括号插值和 v-bind 表达式 (后者从 2.1.0+ 开始支持)。过滤器应该被添加在 JavaScript 表达式的尾部，由“管道”符号指示： 一、定义全局过滤器： JS部分： 调用： 显示结果： 阅读全文

摘要： HTML部分： JS部分： 显示结果： 当点击 显示/隐藏 按钮后： 有图发现，根据Elements可见，v-show所在的p标签只是切换了display:none;的样式，而v-if所控制得标签，则被删除了。 总结： v-if 的特点：每次都会更新删除或创建元素 v-for 的特点：每次不会更新进 阅读全文