小编Mhm*_*z_A的帖子

在下一个js中平滑滚动

如何在 Next.js 中将滚动效果设置为平滑(全局)?我尝试在全局 css 上执行此操作,但它停用了 Next js 已有的滚动到顶部功能。

我也尝试了在互联网上找到的这个解决方案,但它也不起作用。

 componentDidMount() {
 Router.events.on('routeChangeComplete', () => {
    window.scroll({
       top: 0,
       left: 0,
       behavior: 'smooth'
    });
 });
Run Code Online (Sandbox Code Playgroud)

}

smooth-scrolling reactjs next.js

12
推荐指数
3
解决办法
5万
查看次数

为什么逗号运算符会在函数调用中更改“this”

谈话很便宜;给我看代码。

// 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)

javascript this comma-operator

10
推荐指数
2
解决办法
245
查看次数

嵌套 forEach 和 for 循环的函数不会返回 false

我正在做一个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)

javascript foreach for-loop return function

6
推荐指数
1
解决办法
2366
查看次数

检测 CSS 模块/React 中不存在的类名的使用

在我的反应项目中,如果我使用 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)

它悄悄地失败了,没有让我知道这个类不存在。我如何检查这个类名是否存在并抛出错误。如果在构建期间保存文件时收到错误,那就太好了。

javascript reactjs css-modules

4
推荐指数
1
解决办法
2359
查看次数

为什么 React 中忽略了 video 标签上的 `muted` 属性?

好吧,尽管听起来违反直觉,但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)

html javascript reactjs

4
推荐指数
2
解决办法
3073
查看次数

带有 .catch() 的承诺被拒绝,但在 Promise.allSetteled 中显示为已完成

这是问题的简化版本;

有一些承诺,很少的.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)

javascript promise

2
推荐指数
1
解决办法
155
查看次数