小编Max*_*ynn的帖子

static async getInitialProps({ query }) {
  let content;
  let alert;

  try {
    const first = query.first ? query.first : '';
    content = await getContent(first);
  } catch (error) {
    alert = 'There was an error loading data, please try again.';
    content = [];
  }

  return {
    content,
    alert,
  };
}

我正在尝试为这个逻辑编写测试，但因为它是服务器端代码，我很难理解我如何为它编写测试，因为它在 instance() 中对我不可用。

谷歌没有向我展示这个方法，所以我想知道其他人是如何解决为 getInitial props 编写测试的。

我正在尝试模拟一个使用FormData. 该函数接受依赖于目标中某些内容的事件参数。

  buildFormData: (event) => {
    event.preventDefault();
    const { target } = event;
    const data = new FormData(target);

    if (target.querySelectorAll('.ant-select').length) {
      const selectTags = target.querySelectorAll('.ant-select');

      selectTags.forEach((selectTag) => {
        const value = selectTag.querySelector('.ant-select-selection-selected-value').getAttribute('title');
        const property = selectTag.getAttribute('id');
        data.append(property, value);
      });
    }

    const getDataObject = {};

    for (var pair of data.entries()) {
      // Ensures that the data from the forms have a value
      if (pair[1]) {
        getDataObject[pair[0]] = pair[1];
      }
    }

    return getDataObject;
  }

我想确保该函数从模拟表单返回一个值对象。

我试过通过：

const event = { …

当你不知道React的方式时,过去很简单的东西会非常复杂.

我正在尝试创建一个组件,当它到达页面顶部时就像一个粘性页眉或页脚.

目前我非常满足于添加以下内容:

  componentDidMount() {
    window.addEventListener('scroll', this.onScroll, false);
  }

  componentWillUnmount() {
    window.removeEventListener('scroll', this.onScroll, false);
  }

然而,我已经找到了如何获得样式组件的滚动顶部位置.所以假设我有一个调用的样式组件,Container并输出一个表单我通常只是添加一个数据属性,并执行如下所示的操作:

const container = document.getElementbyTag("data-sticky-container")
const position = container.offsetTop 

我将如何在React中执行此操作？

更新

现在用ref.我遇到了一个没有定义电流的问题:

  constructor(props) {
    super(props);
    this.optionBox = React.createRef();
  }

  componentDidMount() {
    window.addEventListener('scroll', this.onScroll, false);
  }

  componentWillUnmount() {
    window.removeEventListener('scroll', this.onScroll, false);
  }

  onScroll() {
    console.log(this.optionBox.current.offsetTop);
  }

试着这样做:

//组件一

toggleDropdown() {
  setState({open: !open}
}

render () {
  return (
   ChildComponent toggle={this.toggleDropdown} />
  )
}

然后在我的子组件中,我想在另一个函数中调用toggleDropdown函数,如下所示:

// This gets triggered on click.
removeItem() {
  // remove scripts then:
  this.props.toggleDropdown()
}

我以为你可以做这样的事情,但似乎你只能在元素上调用prop函数？