我不明白为什么 componentDidMount 运行两次？
class Example extends React.Component {
constructor(props) {
super(props);
this.state = {
count: 0,
};
console.log("constructor");
}
componentDidMount() {
console.log("componentDidMount");
}
render() {
console.log('render');
return (
<div>
<p> Тест </p>
</div>
);
}
}
有你点击的图片和某种声音消失。正音和负音。当您点击图片时，会执行声音播放事件，但只要您点击下一步。图片播放有声音，而之前的声音并没有完全丢失。并播放两种声音，彼此变得更好。如何使其首先播放完全结束，并且在播放声音期间，进一步点击图片将不起作用，仅在播放结束时。对不起，如果我解释得不好。
let imagesCollect = document.querySelectorAll(".cont");
imagesCollect.forEach((i) => {
let imagesItem = this.document.querySelectorAll("img");
imagesItem.forEach((i, index) => {
i.addEventListener("click", (e) => {
if ((e.target.id = `${index + 1}` > 3)) {
sound();
}
});
});
});
function sound() {
let aud = new Audio();
aud.src = "__kirbydx__wah-wah-sad-trombone.mp3";
aud.play();
}
问题是，当我使用“mousemove”事件将鼠标悬停在第一行时，第一行中的文本应该变成红色。当在第二个 - 蓝色。但是在输出端，只要鼠标进入表格，就会同时触发两个处理程序。第一行和第二行中的文本都变成彩色的。如何解决这个问题。
function fn() {
let res = document.querySelector("table");
let resArray = Array.from(res.rows);
resArray.forEach((i, index) => {
if (index == 0) {
i.style.color = "red";
} else if (index == 1) {
i.style.color = "blue";
}
});
}
tableTest.addEventListener("mousemove", () => {
fn();
}); <table border="1" cellspacing="10" width="400" id="tableTest">
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
</table>问题是有两个 div，一个比另一个大。大的一直在移动，想知道小的什么时候会在大的坐标区。我使用这段代码，但输出到处都是空的。为什么会这样。
let boxBig = document.querySelector(".boxBig ");
let y = 50;
let x = 20;
setInterval(() => {
boxBig.style.top = (parseInt(boxBig.style.top) || 0) + y + "px";
let elem = document.elementFromPoint(y, x);
let res = elem.closest(".boxSmall");
console.log(res);
}, 1000);.boxBig {
width: 100px;
height: 100px;
top: 50px;
padding: 2px;
border: 5px solid black;
position: absolute;
}
.boxSmall {
border: 5px solid rgb(231, 26, 91);
position: fixed;
width: 40px;
height: 40px;
top: 400px;
left: 30px;
}<div class="boxBig"></div>
<div class="boxSmall "></div>请帮忙，我通过 setInterval() 设置框的高度在一秒钟内改变 50px。但它只触发一次，元素一次增长 50px，仅此而已，其余的增量在样式中被简单地忽略。为什么会这样。
let app = document.querySelector('.box')
let px = 0
setInterval(() => {
px = px + 50
app.style.width = app.style.width + px + 'px';
console.log(app.style.width + px + 'px');
}, 1000).box {
background-color: grey;
}<div class="box">box</div>请解释为什么是第二个循环。如果没有它，那么只有数组进入res，但根据我的逻辑，那里应该有值。此外，如果它不是一个数组，但例如res最初将是一个字符串，那么它是到达那里的值，如第二个示例所示。我的手往下。
let a = [[[2]], [2], [[3]], [4]];
function flatten(array) {
const res = [];
for (let i = 0; i < array.length; i++) {
if (Array.isArray(array[i])) {
const flat = flatten(array[i]);
for (let j = 0; j < flat.length; j++) {
res.push(flat[j]);
}
} else {
res.push(array[i]);
}
}
return res;
}
console.log(flatten(a));let a = [[[2]], [2], [[3]], [4]];
function fn(arg) {
let res = '';
for (let i = 0; i < arg.length; i++) {
if (Array.isArray(arg[i])) {
let y = fn(arg[i]);
res+=(y);
} else {
res+=(arg[i]);
}
}
return res;
}
console.log(fn(a));