1 多文件组件：一个文件中包含多个组件 组件步骤 第一步：定义 const school = Vue.extend({ template:`<div>{{schoolName}}</div>`, data(){ return { schoolName: '美丽的学校' } } }) // extend可以省略 const st
1.0 引入组件 传统方式编写应用 使用组件方式编写应用 1.1 模块 理解：向外提供特定的js程序，一般就是一个js文件 为什么：js文件很多很复杂 作用：复用js,简化js的编写，提高js运行效率 1.2 组件认识 理解： 用来实现应用中局部（特定）功能代码和资源集合（html/css/js/image...） 为什么： 一个界面的功能很复杂 作用：复用编码，简化项目编码，提
抛出问题：一进入页面就开启一个定时器，每隔1秒count就加1，如何实现 示例： <body> <div id="app"> {{ n }} <button @click="add">执行</button> </div> <script> let vm = ne
1. 过滤器 定义：对要显示的数据进行特定格式转换再显示（适用于一些简单逻辑的处理） 语法： 注册过滤器：Vue.filter(name, callback) 或 new Vue{filters:{}} 使用过滤器：{{ xx | 过滤器名 }} 或 v-bind:属性 = "xxx | 过滤器名" 备注： 过滤器也可以接受额外参数、多个过滤器也可以串联 并没有改变原
1. 条件渲染 v-if v-if="表达式" v-else-if = "表达式" v-else = "表达式" 适用于：切换频率较低的场景 特点：不显示dom元素，直接被删除 注意：v-if和v-else-if、v-else一起使用，但要求结构不能被打断 v-if和template一起使用, v-show不可以 v-show
Vue 监听(watch): 监听一个属性的变化 监事属性watch: 当监视的属性变化时，回调函数自动调用，进行相关操作 监视的属性必须存在，才能进入监视 监视的两种写法： new Vue 时传入watch配置 通过 vm.$watch()监视 immediate初始化时让handler调用一下 深度监视： Vue中的watch默认不监视对象内部值的变化（只监视一层） 配
Vue 1. 事件 v-on @ 基础 使用 v-on:xxx或者@xxx绑定事件，其中xxx是事件名 事件的回调需要配置在methods对象中，最终会在vm上 methods中配置函数，不要用箭头函数，否则this就不是vm了 methods中配置函数，都是被Vue管理的函数，this指向 vm 或者 组件实例对象 @click="demo"和@cli
Vue data中的两种方式 对象式 data:{ } 函数式 data(){ return { } } 示例： <body> <div id="app"> {{ name }} {{ age}} {{$options}} <input type="text&quo
Vue2的终止支持时间为2023年12月31日。 在这个矛盾的时间点，还是决定先把vue2的笔记放出来，在Vue2完结后再把Vue3的笔记补上。这样呢，2和3都不落下，也算是来一个启承的作用吧。在工作中呢，旧的项目可以维护，新的项目也可以上手。后续呢会有react16和react18、node、webpack、vite、以及实战项目，期间会包含umijs,nextjs, nuxtjs等等更多的更前
默认情况下，el-tabs下划线长度根据标签内容自动调整。那么如何自定义e-tabs的样式呢？1.el-tabs标签设置自定义class名<el-tabs v-model="" class='custom-tabs'> <el-tab-pane v-for="(item, index) in list" :key="index" :label="item.value">&
很多时候input设置了type="number"还是能输入字母e,那么如何禁止呢？1.例如input框为<el-input type="number" v-model="" @keydown.native="keyInput" placeholder="请输入数字"></el-input>2.写方法// 去除number输入框内e keyInput(e) { let
1.表单中内容为<el-form> <el-form-item :prop="minPrice" :rules="{ required: true, validator: PriceValidator, trigger: 'blur', }" > <el-input type="Number" min="1" v-model="
1.如何查看很多情况下再chornme浏览器下看不到placeholder的样式，怎么查看?1.打开控制台，点击设置2.在Preferences中找到Element选项，勾选Show user agent shadow DOM3.返回控制台4.查看input元素5.控制台对应元素就会显示placeholder样式2.如何修改找到placeholder父元素节点，直接伪元素修改即可。input输入框
Copyright © 2005-2024 51CTO.COM 版权所有 京ICP证060544号
