Vue30-自定义指令:对象式

一、需求:创建fbind指定

要用js代码实现自动获取焦点的功能!

二、实现

2-1、步骤一:绑定元素 

2-2、步骤二:input元素获取焦点 

此时,页面初始化的时候,input元素并没有获取焦点,点击按钮,修改n的值只有,才获取焦点。

因为:focus函数的位置不对!!!

1、html说明focus函数的位置 

若是将focus函数放在appendchild函数前面,则不生效!!! 

大部分在appendChild之前都可以,有一些功能要在appendChild之后 

2、自定义函数的生命周期 

 

解决方式:fbind写成对象形式,因为函数形式只有两种时机才会调用。

写成对象形式,对象中可以写多个函数!

①、常见的自定义函数对象形式里面的函数: 

 

②、bind函数

bind函数类似于html中的这一部分的代码。

3、解决获取焦点的问题 

注意:

        因为bind函数和update函数的内容一般差不多,所以,要是自定义指令写成函数形式,相当于是对象形式的bind+uodate函数都写了。 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/26891.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

NestJS学习笔记

一、安装NestJS CLI工具 环境检查 //查看node版本 node -v//查看npm版本 npm -v 安装nest/cli 使用npm全局安装nestjs/cli npm i -g nestjs/cli 查看nest版本 nest -v 结果如图: 创建nest项目 //命令行创建nest项目 nest new 【项目名】 VScode扩展下载 1、…

远程登录新建会话

在做远程登录会话建立的时候有时候会忘记顺便就记录了,方便后期回顾

没有登录微信就不会截图了?这个方法你一定要学会

前言 前段时间小白在指导小伙伴的时候,发现他在电脑没有登录微信的时候就不会截图了。 这个可就难倒他了…… 所以他登录了个微信,然后截了张图,接着把微信退出了。这人可真是谨慎啊~ 所以,小伙伴在使用电脑的时候…

JWT工具【工具类】

一、JWT JSON Web Token (JWT)是一个开放标准(RFC 7519),定义了一种紧凑且自包含的方式,以JSON对象的形式在各方之间安全地传输信息。这种信息可以被验证和信任,因为它是数字签名的。具体来说,JWT是一种用…

科技赋能,避震婴儿车或成为行业硬通货

全球知识经济发展发展到今天,消费者对于品质、服务、体验的要求越来越高,与之对应的产品也就越来越科技化、智能化、个性化,品牌化和差异化逐步成为产品的竞争核心。 婴儿推车作为关系婴幼儿出行安全的支柱性产业之一,从车架结构…

graalvm编译springboot3 native应用

云原生时代容器先行,为了更好的拥抱云原生,spring boot3之后,推出了graalvm编译boot项目,利用jvm的AOT( Ahead Of Time )运行前编译技术,可以将javay源码直接构建成机器码二进制的文件&#xff…

泰坦尼克号数据集机器学习实战教程

泰坦尼克号数据集是一个公开可获取的数据集,源自1912年沉没的RMS泰坦尼克号事件。这个数据集被广泛用于教育和研究,特别是作为机器学习和数据分析的经典案例。数据集记录了船上乘客的一些信息,以及他们是否在灾难中幸存下来。以下是数据集中主…

嵌入式实训day3

1、 planet_list["水星","金星","火星","木星"] print(planet_list)planet_list.insert(2,"地球") print(planet_list)planet_list.append("土星") planet_list.append("天王星") planet_list.append(&…

MultiTrust:首个综合统一的多模态信任度基准(上)

随着我们迈向人工通用智能(AGI)的时代,出现了开创性的大语言模型(LLMs)。凭借它们强大的语言理解和推理能力,已经无缝地将其他模态(例如视觉)整合到LLMs中,以理解不同的输…

SSRF学习,刷题

[HNCTF 2022 WEEK2]ez_ssrf 给了一个Apache2的界面,翻译一下 就是一个默认的界面,目录扫描 可以看到flag.php,肯定是不能直接访问得到的,还有index.php,访问这个 可以看到三个参数data,host,port 还有fsockopen() 函数是 PHP 中用于打开一个…

排名前五的 Android 数据恢复软件

正在寻找数据恢复软件来从 Android 设备恢复数据?本指南将为您提供 5 款最佳 Android 数据恢复软件。浏览这些软件,然后选择您喜欢的一款来恢复 Android 数据。 ndroid 设备上的数据丢失可能是一种令人沮丧的经历,无论是由于意外删除、系统崩…

HTML静态网页成品作业(HTML+CSS)—— 非遗皮影戏介绍网页(6个页面)

🎉不定期分享源码,关注不丢失哦 文章目录 一、作品介绍二、作品演示三、代码目录四、网站代码HTML部分代码 五、源码获取 一、作品介绍 🏷️本套采用HTMLCSS,未使用Javacsript代码,共有6个页面。 二、作品演示 三、代…

智慧工地:构筑未来建筑的智能脉络

在科技日新月异的今天,智慧城市的建设已不再局限于城市生活的方方面面,而是深入到了城市发展的每一个细胞——工地。本文旨在深度剖析智慧工地的核心价值、关键技术及对建筑业转型升级的深远影响。 一、智慧工地:定义与愿景 智慧工地是指运…

探囊取物之渐变背景登录页面(基于ElementUI)

低配置云服务器,首次加载速度较慢,请耐心等候 预览页面:http://www.daelui.com/#/tigerlair/saas/preview/lxbupnc9dg5q 演练页面:http://www.daelui.com/#/tigerlair/saas/practice/lxbupnc9dg5q

MYSQL六、存储引擎的认识

一、存储引擎 1、MySQL体系结构 连接层:最上层是一些客户端和链接服务,包含本地sock 通信和大多数基于客户端/服务端工具实现的类似于TCP/IP的通信。主要完成一些类似于连接处理、授权认证、及相关的安全方案。在该层上引入了线程池的概念,为…

visio绘制直线

1、右键打开绘图工具 2、选择线条 3、画直线、画横线

Apache Pulsar 从入门到精通

一、快速入门 Pulsar 是一个分布式发布-订阅消息平台,具有非常灵活的消息模型和直观的客户端 API。 最初由 Yahoo 开发,在 2016 年开源,并于2018年9月毕业成为 Apache 基金会的顶级项目。Pulsar 已经在 Yahoo 的生产环境使用了三年多&#…

C++ 10 之 引用

c10引用.cpp #include <iostream>using namespace std;int main() {// 引用的语法&#xff1a;类型 &别名 原名// int a 10;// int &b a; // 此时a,b指向同一块内存// cout << "a: " << a << endl;// cout << "b: &…

【高校科研前沿】北京大学赵鹏军教授团队在Nature Communications发文:揭示城市人群移动的空间方向性

文章简介 论文名称&#xff1a;Unravelling the spatial directionality of urban mobility 第一作者及单位&#xff1a;赵鹏军&#xff08;教授|第一作者|北京大学&#xff09;&王浩&#xff08;博士生|共同一作|北京大学&#xff09;; 通讯作者及单位&#xff1a;赵鹏军…

微服务 | Springboot整合Dubbo+Nacos实现RPC调用

官网&#xff1a;Apache Dubbo 随着互联网技术的飞速发展&#xff0c;越来越多的企业和开发者开始关注微服务架构。微服务架构可以将一个大型的应用拆分成多个独立、可扩展、可维护的小型服务&#xff0c;每个服务负责实现应用的一部分功能。这种架构方式可以提高开发效率&…