小编Les*_*kov的帖子

我正在尝试将 CSS 模块用于 html，由 html-webpack-plugin 生成。

重现错误的代码

源代码/索引.ejs

<div class="<%= require('./item.css').foo %>"></div>

源代码/样式.css

<div class="<%= require('./item.css').foo %>"></div>

此代码与以下配置捆绑在一起，以某种方式工作（css 模块散列类名找到了生成的方式index.html）：

webpack.config.js

.foo {
  color: red
}

但问题是 CSS 块没有被 emmited。

% npm run build -- --mode production

> simple-nunjucks-loader-example-isomporphic@1.0.0 build /Users/user/Projects/nunjucks-loader/examples/isomorphic
> webpack "--mode" "production"

Hash: 5edf5687d32d114e6469
Version: webpack 4.41.5
Time: 526ms
Built at: 01/02/2020 10:51:04 PM
     Asset       Size  Chunks             Chunk Names
index.html   98 bytes          [emitted]  
   main.js  930 bytes       0  [emitted]  main
Entrypoint main = main.js
[0] ./src/index.js 1.43 …

在React中制作"流动tabindex"最简单的方法是什么？它基本上是切换焦点和tabindex=0/-1子元素之间.仅单个元件具有tabindex的0,而另一组接受-1.箭头键tabindex在子元素之间切换,并将其聚焦.

现在,我做一个简单的子映射所需的类型,并设置indexprop和get ref,以便以后使用它.它看起来很健壮,但可能有更简单的解决方案吗？

我目前的解决方案(伪javascript,仅用于想法说明):

ElementWithFocusManagement.js

function recursivelyMapElementsOfType(children, isRequiredType, getProps) {
  return Children.map(children, function(child) {
    if (isValidElement(child) === false) {return child;}

    if (isRequiredType(child)) {

      return cloneElement(
        child,
        // Return new props
        // {
        //   index, iterated in getProps closure
        //   focusRef, saved to `this.focusable` aswell, w/ index above
        // }
        getProps()
      );
    }

    if (child.props.children) {
      return cloneElement(child, {
        children: recursivelyMapElementsOfType(child.props.children, isRequiredType, getProps)
      });
    }

    return child;
  }); …