小编gke*_*ley的帖子

为什么将componentDidMount更改为非箭头功能会使热重装再次工作?

对于我的React Native应用程序中的一个屏幕,无法进行热重装。我发现解决方案是改变这一点

componentDidMount = () => {
  <...do stuff with this.props...>
}
Run Code Online (Sandbox Code Playgroud)

对此

componentDidMount() {
  <...do stuff with this.props...>
}
Run Code Online (Sandbox Code Playgroud)

因此,我所做的只是将componentDidMount箭头功能更改为非箭头功能。所以我的问题是:

为什么将其更改为非箭头功能会使热重装再次工作?我知道使其成为非箭头函数意味着如果从其他上下文调用该函数,则其值this将被重新绑定到调用该函数的上下文中,而使用箭头函数将始终被绑定到定义它的组件。但这如何影响热装?热重装是否会导致componentDidMount从其他上下文调用并this重新绑定?如果是这样,那将如何影响热装?

谢谢!

更新

一些用户问这是否是(ES6对象中的方法:使用箭头函数)或(箭头函数与函数声明/表达式:它们是否等效/可互换?)的重复项。

这不是这两个的重复。请注意,我确实概述了箭头功能和非箭头功能之间的区别。我的问题是这些差异如何专门应用于热重装。

javascript reloading reactjs react-native hot-reload

5
推荐指数
1
解决办法
135
查看次数

React Native 中 ios/build 文件夹的作用是什么?

我正在对 React Native 应用程序进行故障排除,一篇文章建议删除该ios/build文件夹,但没有解释原因。有谁尽可能详细地知道该文件夹的作用是什么,它是如何创建的,以及删除它的含义是什么?

谢谢!

javascript build reactjs react-native

5
推荐指数
1
解决办法
8978
查看次数

无法从 React Native 中的父组件调用子组件方法

我有一个<Parent>包含组件的 React Native 组件,<Child>我希望能够在 Parent 中调用 Child 的方法之一。在阅读了一堆其他帖子后,这就是我所拥有的:

儿童.js

export default class Child extends Component {
  method1() {
    console.log("success");
  }
  render() {
    return(
      <View/>
    )
  }
}
Run Code Online (Sandbox Code Playgroud)

家长

export default class Parent extends Component {
  render() {
    return(
      <View>
        <TouchableOpacity
          onPress={() => this.child.method1()}
        />
        <Child
          onRef={ref => (this.child = ref)}
        />
      </View>
    )
  }
}
Run Code Online (Sandbox Code Playgroud)

我收到错误“_this2.child.method1 不是函数。”

我尝试过的其他事情是使用refInput而不是onRef,而ref => {this.child = ref}不是ref => (this.child = ref)

有任何想法吗?

谢谢!

javascript reactjs react-native

5
推荐指数
2
解决办法
3021
查看次数

onStartShouldSetPanResponder vs onMoveShouldSetPanResponder in React Native

I'm working with the PanResponder in React Native, and am considering the scenario in which I click an Animated.View and drag it. I have the following code:

this.panResponder = PanResponder.create({
  onStartShouldSetPanResponder: () => true,
  onMoveShouldSetPanResponder: () => true,
  onPanResponderGrant: () => {
    this.animatedValue.setOffset({
      x: this._value.x,
      y: this._value.y,
    })
    this.animatedValue.setValue({ x: 0, y: 0})
  },
  onPanResponderMove: Animated.event([
    null,
    {
      dx: this.animatedValue.x,
      dy: this.animatedValue.y
    }
  ])
})
Run Code Online (Sandbox Code Playgroud)

My questions are:

1) If I click the Animated.View that the PanResponder is attached to, …

javascript gesture-recognition gesture react-native

5
推荐指数
1
解决办法
2283
查看次数

当您在 git 中推送分支时,是否会推送对本地分支的引用?

如果我有我的本地机器与当地分公司的一个项目“凸出” localA,并localB对应于远程分支机构‘remoteA’和‘remoteB’我还没想好,推动localAlocalBremoteAremoteB,但我想开关机,并获得tolocalA和 localB。如果我在 master 上并推送到 master(我知道这是一个无操作,但只是想了解原则),然后拉上另一台机器,我可以访问localAlocalB吗?换句话说,做当你推送一个分支时,对本地分支的引用会被推送?如果没有,有没有其他方法可以做到这一点?

git

5
推荐指数
1
解决办法
156
查看次数

React Native:什么控制 iPhone 屏幕上应用程序图标上红色圆圈中的数字?

当我的 iPhone 上有应用程序时,如果我收到该应用程序中某些内容的通知,我的 iPhone 跳板上的应用程序图标的右上角会出现一个红色圆圈。

如果我正在构建 React Native 应用程序,那么什么控制着这个数字?

iphone ios springboard react-native

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

你可以在 React Native 异步中创建 render() 方法吗?

我有一个 React Native 组件,它需要从异步存储中获取一个对象才能进行渲染。像这样的东西。

class Class1 extends Component {
  async render() {
    let data = AsyncStorage.getItem('data');
    return (
      <View>
        {data}
      </View>
    )
  }
}
Run Code Online (Sandbox Code Playgroud)

我让我的 render() 方法成为异步函数的原因是,我可以等待 AsyncStorage.getItem() 方法的返回,以便组件不会尝试返回直到“数据”对象具有已从异步存储返回。但是,当我使用“async render()”时,我得到“Invariant Violation: Objects are not valid as a React child”。

有小费吗?

asynchronous react-native

3
推荐指数
1
解决办法
6326
查看次数

React Native FlexBox:为什么添加“alignItems”会阻止子项具有 100% 宽度?

在我的 React Native 应用程序中,我有一个父级,它包含一个包含元素的View子级。默认情况下,子视图的宽度会拉伸以填充父视图。但如果我添加,子项会移动到中心,但其宽度也会缩小到仅适合其包含的文本的宽度。ViewTextalignItems: 'center'

这是一份小吃。取消注释alignItems: 'center'以查看差异:https ://snack.expo.io/@gkeenley/alignitems-example

有谁知道为什么会发生这种情况?

css flexbox reactjs react-native react-native-flexbox

3
推荐指数
1
解决办法
1645
查看次数

React Native:gradle-wrapper.properties 和 build.gradle 中的 gradle 引用有什么区别?

在我的 React Native 应用程序中,我收到了与 不兼容的错误gradle 6,因此我查看了我的项目结构以找出我在项目中运行的 gradle 版本。我在中找到了这一行gradle-wrapper.properties

distributionUrl=https\://services.gradle.org/distributions/gradle-5.5-all.zip
Run Code Online (Sandbox Code Playgroud)

和这一行build.gradle

classpath("com.android.tools.build:gradle:3.4.2")
Run Code Online (Sandbox Code Playgroud)

我想知道的是:每个文件中对 gradle 的引用有什么区别?换句话说,我的项目中5.5版本是如何使用的,3.4.2版本又是如何使用的?

android gradle react-native

3
推荐指数
1
解决办法
503
查看次数

React hooks:如何检测特定状态变量何时更新

在 React hooks 之前,我会使用componentDidUpdate(prevProps, prevState),如果我想仅在更新时执行给定的代码this.state.a,我会这样做

if (prevState.a !== this.state.a) {
  <...>
}
Run Code Online (Sandbox Code Playgroud)

我怎样才能实现同样的事情useEffect()

javascript reactjs react-native asynchronous-javascript react-hooks

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