如何在 Next.js 中将滚动效果设置为平滑(全局)?我尝试在全局 css 上执行此操作,但它停用了 Next js 已有的滚动到顶部功能。
我也尝试了在互联网上找到的这个解决方案,但它也不起作用。
componentDidMount() {
Router.events.on('routeChangeComplete', () => {
window.scroll({
top: 0,
left: 0,
behavior: 'smooth'
});
});
Run Code Online (Sandbox Code Playgroud)
}
谈话很便宜;给我看代码。
// equals to this.test = "inside window"
var test = "inside window";
function f () {
console.log(this.test)
};
var a = {
test: "inside object",
fn: f
};
a.fn(); // "inside object" --> fine
(a).fn(); // "inside object" --> fine
(1, a).fn(); // "inside object" --> fine
(a.fn)(); // "inside object" --> fine
(1, a.fn)(); // "inside window" --> why?
// reference equality check
console.log(
f === a.fn &&
(a.fn) === f &&
f === (1, a.fn)
); // …Run Code Online (Sandbox Code Playgroud)我正在做一个JS 练习的算法挑战。我有一个循环运行的程序,当满足条件时,该函数应该返回 false。然而,当条件满足时,返回不起作用,函数最终总是返回 true。
const isDiagonalLeftWristband = (band) => {
band.forEach((row, y) => {
row.forEach((item, x) => {
for(let i = 0; (i < band[y].length - x) && (i < band.length - y); i++) {
if (band[y][x] !== band[y+i][x+i]) {
console.log(false) //FALSE GETS OUTPUTTED MULTIPLE TIMES
return false;
}
}
})
})
return true;
}
const band3 = [
["A", "B", "C"],
["C", "Z", "B"],
["B", "C", "A"],
["A", "B", "C"]
];
console.log(isDiagonalLeftWristband(band3))Run Code Online (Sandbox Code Playgroud)
输出:
false //from console log …Run Code Online (Sandbox Code Playgroud) 在我的反应项目中,如果我使用 css 模块文件中一些不存在的 className,
// mycss.modules.scss
.thing { color: red }
// index.jsx
import styles from mycss.modules.scss
<div className={styles.otherThing}>Some div</div>
// Browser would return:
<div>Some div</div>
Run Code Online (Sandbox Code Playgroud)
它悄悄地失败了,没有让我知道这个类不存在。我如何检查这个类名是否存在并抛出错误。如果在构建期间保存文件时收到错误,那就太好了。
好吧,尽管听起来违反直觉,但muted标签在某种程度上被忽略了;查看下面的代码片段,第一个是用 react 渲染的,第二个是普通的 html;与你的开发工具检查他们,你看到的反应上不具有muted的属性; 我已经试过了muted={true},muted="true"但非工作。
function VideoPreview() {
return (
<div className="videopreview-container">
React tag:
<video
className="videopreview-container_video"
width="320"
height="240"
controls
autoPlay
muted
>
<source src="https://raw.githubusercontent.com/rpsthecoder/h/gh-pages/OSRO-animation.mp4" type="video/mp4" />
Your browser does not support the video tag.
</video>
</div>
);
}
ReactDOM.render(<VideoPreview />, root)Run Code Online (Sandbox Code Playgroud)
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
<div id="root"></div>
<hr/>
Regular html:
<video
width="320"
height="240"
controls
autoplay
muted
>
<source src="https://raw.githubusercontent.com/rpsthecoder/h/gh-pages/OSRO-animation.mp4" type="video/mp4" />
Your browser does not support the video tag.
</video>Run Code Online (Sandbox Code Playgroud)
这是问题的简化版本;
有一些承诺,很少的.then()链和一个.catch()用于错误处理的块;每个承诺可能会解决或拒绝,因此我Promise.allSetted曾经根据它们的数组顺序和状态来知道哪个承诺失败了;当所有承诺都解决时它工作正常,但当承诺被拒绝时,它的状态将显示为“已完成” Promise.allSetteld;如果我删除该.catch()块,它将按预期工作,但我们需要保留该.catch()块以登录到商店;那么为什么它不像预期的那样表现呢?有没有办法让它显示“被拒绝”的状态.catch()?
let a = Promise.resolve("a: Promise.resolved").then(response => response).catch(err=>console.log(err));
let b = Promise.reject("b: Promise.rejected").then(response => response); // no error handling
let e = Promise.reject("e: Promise.rejected").then(response => response).catch(err=>console.log(err));
Promise.allSettled([a,b,e]).then( values => console.log(values) );Run Code Online (Sandbox Code Playgroud)