vue3ref获取元素
目录1、概念2、示例代码1、概念利用ref函数获取组件中的标签元素。2、示例代码功能需求让输入框自动获取焦点。<template> <h2>ref的另一个作用:可以获取页面中的元素</h2> <input type="text" ref="inputRef" /></template>import { defineComponent, onMounted, ref } from "vue";export
vue3shallowReactive与shallowRef
目录1、概念2、示例代码1、概念●shallowReactive:只处理对象内最外层属性的响应式,也就是浅响应式。●shallowRef:只处理value的响应式, 不进行对象的reactive处理。●什么时候用浅响应式呢?○一般情况下使用ref和reactive即可。○如果一个对象数据, 结构比较深, 但变化时只是外层属性变化使用shallowReactive。○如果一个对象数据, 后面会产生新的对象来替换使用shallowRef。2、示例代码<template>
vue3readonly与shallowReadonly
目录1、概念2、示例代码1、概念●readonly○深度只读数据。○获取一个对象 (响应式或纯对象) 或 ref 并返回原始代理的只读代理。○只读代理是深层的:访问的任何嵌套 property 也是只读的。●shallowReadonly○浅只读数据。○创建一个代理,使其自身的 property 为只读,但不执行嵌套对象的深度只读转换。●应用场景○在某些特定情况下, 我们可能不希望对数据进行更新的操作, 那就可以包装生成一个只读代理对象来读取数据, 而不能修改或删除。2、示例代
vue3toRaw与markRaw
目录1、概念2、示例代码1、概念toRaw返回由 reactive 或 readonly 方法转换成响应式代理的普通对象。这是一个还原方法,可用于临时读取,访问不会被代理/跟踪,写入时也不会触发界面更新。markRaw标记一个对象,使其永远不会转换为代理。返回对象本身。应用场景有些值不应被设置为响应式的,例如复杂的第三方类实例或 Vue 组件对象。当渲染具有不可变数据源的大列表时,跳过代理转换可以提高性能。2、示例代码<template> <h2>t
vue3toRef的特点及使用
目录1、概念2、示例及代码2.1、页面2.2、子组件1、概念●为源响应式对象上的某个属性创建一个ref对象,二者内部操作的是同一个数据值,更新时二者是同步关系。●区别ref: 拷贝了一份新的数据值单独操作,更新时互不影响。●应用: 当要将某个prop的ref传递给复合函数时,toRef很有用。2、示例及代码2.1、页面<template> <h2>toRef的使用及特点:</h2> <h3>state:{{ state }}<
vue3customRef
目录1、概念2、代码示例1、概念创建一个自定义的ref,并对其依赖项跟踪和更新触发进行显式控制。2、代码示例需求使用customRef实现debounce的示例。<template> <h2>CustomRef的使用</h2> <input type="text" v-model="keyword" /> <p>{{ keyword }}</p></template>import
JavaScript操作JSON实用方法
目录1、JSON字符串转化JSON对象1、JSON字符串转化JSON对象function () { let dfs ='{"name":"Liza", "password":"123"}' ;}
JavaScript获取字符串(string)最后一个字符
let stringVal = "web半晨";// 方式一console.log(stringVal.charAt(stringVal.length - 1)); // 晨// 方式二console.log(stringVal.substr(stringVal.length - 1, 1)); // 晨// 方式三console.log(stringVal.split("")[stringVal.length - 1]); // 晨// 方式四console.log(stringVal.r
JavaScript获取字符串(string)第一个字符
let stringVal = "web半晨";// 方式一console.log(stringVal.charAt(0));// 方式二console.log(stringVal.substring(0, 1));// 方式三console.log(stringVal.substr(0, 1));
数组Array常用方法
数组(Array)常用方法Array.map( ) 此方法是将数组中的每个元素调用一个提供的函数,结果作为一个新的数组返回,并没有改变原来的数组Array.forEach( ) - 此方法是将数组中的每个元素执行传进提供的函数,没有返回值,注意和map方法区分Array.filter( ) 此方法是将所有元素进行判断,将满足条件的元素作为一个新的数组返回Array.every( ) 此方法是将所有元素进行判断返回一个布尔值,如果所有元素都满足判断条件,则返回true,否则为falseArray
ElementUI问题清单
目录1、form下面只有一个input时回车键刷新页面2、表格固定列,最后一行显示不全3、气泡确认框文档里的confirm事件不生效4、输入框用正则限制但绑定值未更新5、去除type="number"输入框聚焦时的上下箭头6、只校验表单其中一个字段7、弹窗重新打开时表单上次的校验信息未清除8、表头与内容错位9、表单多级数据结构校验问题10、表格跨分页多选11、根据条件高亮行并去除默认hover颜色12、表单不想显示label但又想显示必填星号怎么办13、table内嵌input调用focus方法无效14、表
webpackBig
目录1、webpack是什么?2、webpack与grunt、gulp的区别?2.1、区别2.2、总结3、Webpack的五个核心概念4、有哪些常见的Loader?你用过哪些Loader?1、webpack是什么?1、一种前端资源构建工具,一个静态模块打包器(nodule bundle)。2、前端所有资源文件(js/json/css/img…)都会作为模块处理。3、它将根据模块的依赖关系进行静态分析,打包生成对应的静态资源(bundle)。2、webpack与grunt、gulp的区别?
Android活动的启动模式
Android 活动启动模式Android活动的启动模式一般分为四种:分别是standard、singleTop、singleTask和singleInstance。1.standard这种是默认的启动模式,在standard模式(即默认情况)下,每当启动一个新的活动,它就会在返回栈中入栈,并处于栈顶的位置。对于使用standard模式的活动,系统不会在乎这个活动是否已经在返回栈中存在,每次启动都会创建该活动的一个新的实例2.singTopstandard模式在有些情况下多少有些不合理,singT
创业管理实战2021年秋(考试答案)
一、单选题 (题数:40,共40.0分)1下列不属于创业典型分类法中的是()。(1.0分)1.0分A、 生存型与机会型创业 B、 互联网创业、衍生创业 C、 创新型创业与联盟型创业 D、 个体创业与组织创业 正确答案: C 我的答案:C2美国某所大学研究发现,完成计划书的潜在创业者开创新企业的可能性与未写计划书的创业者之间相差()。(1.0分)1.0分A、 6倍 B、 5倍 C、 4倍 D、 3倍 正确答...
今日推荐
周排行