效果图 网页结构部分: <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>注册</title> <link rel="stylesheet" href="css/public.css"> <link rel="style
2024-11-261.父向子组件传参 App.vue为父,引入componetA组件之后,则可以在App.vue中使用标签(注意驼峰写法要改成componet-a写法,因为html对大小写不敏感,componenta与componentA对于它来说是一样的,不好区分,所以使用小写-小写这种写法)。 而子组件componetA中,声明props参数’msgfromfa’之后,就可以收到父向子组件传的参数了。例子中将msgfromfa显示在<p>标签中。 App.vue中 <component-a msgfromfa
2024-11-26在开发中 有时会在打包或者各种可能的情况下 报错或警告提示 模块化打包的问题, 我们需要动态引入组件并渲染组件时, 方法1: 可以使用import引入结合component标签使用 如下举例 import { ref, markRaw } from 'vue' const childrenComponent = ref(); onMounted(() => { //举例引入一个组件childrenComponent.vue import('**/..**../childrenCompone
2024-11-26一、用Promise实现红绿灯不断交替亮灯的逻辑 红灯3秒亮一次,绿灯1秒亮一次,黄灯2秒亮一次; 如何让三个灯不断交替重复亮灯?(用Promise实现)三个亮灯函数已经存在: function red() { console.log('red'); } function green() { console.log('green'); } function yellow() { console.log('yellow'); } 解析: 答案: function red
2024-11-26嵌套块元素垂直外边距合并造成的塌陷 我们先看例图 解决办法
2024-11-26React笔记(四) 1.旧组件生命周期 在类式组件上存在着一些生命周期函数,其贯穿了整个React的组件的生命周期。旧版的整体的组件生命周期如下图所示。旧版的组件生命周期分为两个阶段。挂载卸载阶段与更新阶段。render则是独立于这两个阶段作为渲染阶段存在。 在组件挂载卸载阶段中,存在四步操作 最初,对于一个类式组件,要先将其实例化,只有实例化之后才可以通过React将JSobject的对象渲染成一块DOM。那么为了实例化,首先调用的就是构造器constructor。其接受参数prop
2024-11-261.声明包裹的容器,display: grid;(父元素) 2.分列grid-template-columns;(父元素) grid-template-columns: 1fr 1fr 1fr; //该wrap分3列 grid-template-columns: repeat(3, 1fr);//等于上面的 grid-template-columns: 500px 1fr 2fr;//可以用px grid-template-columns: 10px repeat(6, 1fr) 10px;//
2024-11-26完成 CSRF 攻击必须要有三个条件: 1、用户已经登录了站点 A,并在本地记录了 cookie 2、在用户没有登出站点 A 的情况下(也就是 cookie 生效的情况下),访问了恶意攻击者提供的引诱危险站点 B(B 站点要求访问站点A)。 3、站点 A 没有做任何 CSRF防御 2、XSS攻击
2024-11-261.原型链 原型链作为实现继承的主要方法,其基本思想是利用原型让一个引用类型继承另一个引用类型的属性和方法。 简单理解为:将父类构造函数的实例对象作为子类构造函数的原型对象,通过修改原型的方式实现继承另一个引用类型的属性和方法。 代码演示: function Parent(name) { this.name = name; this.children = ["a", "b"]; } function Child() {}
2024-11-26前言 最近无意中看到了这篇文章:,想法真的很奇思妙想,让人视野和思路一下子就开阔起来了。 建议查看原文,这里按照文章的思路来实现一下长按事件 长按事件 在原生js中是没有长按事件的,一般都是通过定时器来完成 el.onmousedown = function(){ this.timer && clearTimeout(this.timer); this.timer = settimeout(function(){ //业务代码 },350) } el.on
2024-11-26