相关疑难解决方法(0)

我正在创建一个简单的动作按钮(浮动按钮)

这是有效的:

<View style={{
    width: this.props.size,
    height: this.props.size,
    borderRadius: this.props.size / 2,
    backgroundColor: '#ee6e73',
    position: 'absolute',
    bottom: 10,
    right: 10,
    flexDirection:'row'
}}>
    <Text>
        +
    </Text>
</View>

这不是 :

<TouchableOpacity
        onPress={()=>{
        }} >
    <View style={{
        width: this.props.size,
        height: this.props.size,
        borderRadius: this.props.size / 2,
        backgroundColor: '#ee6e73',
        position: 'absolute',
        bottom: 10,
        right: 10,
        flexDirection:'row'
    }}>
        <Text>
            +
        </Text>
    </View>
</TouchableOpacity>

只需使用TouchableOpacity包装,然后我的按钮就不会出现任何错误.

React 0.1.7,Android

然后我尝试从View到TouchableOpacity移动样式,这是工作

<TouchableOpacity
        onPress={()=>{
        }} 
        style={{
            width: this.props.size,
            height: this.props.size,
            position: 'absolute',
            borderRadius: this.props.size / 2,
            backgroundColor: '#ee6e73',
            bottom: 10,
            right: …

根据文档：

当<MyContext.Provider>组件上方最近的更新时，此 Hook 将使用传递给该 MyContext 提供程序的最新上下文值触发重新渲染。即使祖先使用React.memoor shouldComponentUpdate，仍然会使用 useContext 从组件本身开始重新渲染。...当上下文值更改时，调用 useContext 的组件将始终重新渲染。

在我的 Gatsby JS 项目中，我将我的 Context 定义为：

上下文.js

import React from "react"

const defaultContextValue = {
  data: {
    filterBy: 'year',
    isOptionClicked: false,
    filterValue: ''
  },
  set: () => {},
}

const Context = React.createContext(defaultContextValue)

class ContextProviderComponent extends React.Component {
  constructor() {
    super()

    this.setData = this.setData.bind(this)
    this.state = {
      ...defaultContextValue,
      set: this.setData,
    }
  }

  setData(newData) {
    this.setState(state => ({
      data: {
        ...state.data,
        ...newData,
      }, …