我正在尝试为关闭元素构建一个通用 HOC，点击其空间外（通用关闭外部解决方案）。
在我看来，这可以通过 forwardRef 和 HOC 实现来实现，尽管官方文档中有一个示例，但我似乎无法正确理解。
所以我希望我的 HOC 创建对组件容器的引用。它正在包装，因为它具有跟踪点击并对其采取行动的处理程序。例如，假设我们有一个通用的 Dropdown 组件，人们希望我可以在该组件区域外的任何单击时关闭它。
我目前拥有的代码：
import React from 'react';
function withClose(Component) {
class ClickContainer extends React.Component {
constructor() {
super();
this.handleClose = this.handleClose.bind(this);
}
componentDidMount() {
document.addEventListener('click', this.handleClose);
}
componentWillUnmount() {
document.removeEventListener('click', this.handleClose);
}
handleClose(e) {
// I expect having here context of container of wrapped component to do something like
const { forwardedRef } = this.props; // <- I expect having context in forwardedRef variable
}
render() {
const { forwardedRef, …我是个新手，我已经使用React 14编写了没有任何编译器的代码。现在，我想使用Karma-Jasmine进行单元测试，但是看来我的测试未能呈现该应用程序。
我有以下结构：
node_modules
MyApp/
/js/ *.js
/test/*.js
Karma.conf.js
package.json
index.html
我的index.html：
<html>
<div id="content"></div>
<script src="js/react-0.14.7.js"></script>
<script src="js/react-dom-0.14.7.js"></script>
<script src="js/App.js"></script>
<script src="js/main.js"></script>
<link rel="stylesheet" href="style.css">
</body>
</html>
我的main.js：
ReactDOM.render(React.createElement(App), document.getElementById('content'))
我的应用程序如下所示：
var h = React.createElement;
var Command = React.createClass({
render: function(){
return h(....)
}
})
我的测试代码如下：
describe('App', function() {
beforeEach(function() {
fixture.load('index.htm');
});
beforeEach(function () {
ReactDOM.render(React.createElement(App), document.getElementById('content'));
});
it('accepts elements', function() {
document.getElementById('x').value = 1;
document.getElementById('y').value = 2;
document.getElementById('setbtn').click();
});
});
这是错误：
Uncaught ReferenceError: App is not defined …从昨天开始，我无法将我的 Gatsby 站点部署到我们的服务器，build 抱怨 mozjpeg 库。有没有人遇到过这个错误？
我试过：
automakelinux包libtoolslinux包但似乎没有任何帮助，错误如下：
error /node_modules/mozjpeg: Command failed.
Exit code: 1
Command: node lib/install.js
Arguments:
Directory: /node_modules/mozjpeg
Output:
? spawn /node_modules/mozjpeg/vendor/cjpeg ENOENT
? mozjpeg pre-build test failed
? compiling from source
? Error: Command failed: /bin/sh -c ./configure --enable-static --disable-shared --disable-dependency-tracking --with-jpeg8 --prefix="/node_modules/mozjpeg/vendor" --bindir="/node_modules/mozjpeg/vendor" --libdir="/node_modules/mozjpeg/vendor"
操作系统 Ubuntu 16.04.6 节点 12.14 Gatsby 2.19.7
xs下面代码中的是什么意思？
<Grid item xs>
<Link href="#" variant="body2">
Forgot password?
</Link>
</Grid>
<Grid item>
<Link href="#" variant="body2">
{"Don't have an account? Sign Up"}
</Link>
</Grid>
</Grid>
reactjs ×3
javascript ×2
docker ×1
gatsby ×1
jasmine ×1
linux ×1
material-ui ×1
node.js ×1
npm ×1
unit-testing ×1