小编roc*_*one的帖子

如果我从主屏幕转到产品详细信息屏幕，然后转到购物车屏幕，则状态更新工作正常，但如果从购物车屏幕添加商品或删除商品，然后导航回产品详细信息或主屏幕，则状态不会更新，为什么会这样？请参阅下面的 vudeo 链接：https://drive.google.com/file/d/1AjrFMAXBs9Gzc5Onbm1uf-eW9gFfHxMU/view ?usp=sharing

我正在使用 redux，但即使 redux 存储状态已更新，它仍然不会渲染具有更新状态的组件，为什么会这样？

我正在考虑使用反应导航事件，但我收到错误，为什么会这样？如何解决问题？这是 redux 问题还是 React 导航问题？当导航回上一屏幕时，组件是否会重新渲染？

如果我刷新模拟器屏幕，状态就会更新并正确显示，为什么会发生这种情况？

我想在焦点返回时重新渲染 Home 组件，但出现错误。为什么这样？

截屏：

代码：

home.js：

import React, {useState, useEffect} from 'react';
import {
    StyleSheet,
    ScrollView,
    View,
    Text,
    StatusBar,
    Image,
    TouchableOpacity,
    Button
} from 'react-native';
import Product from '../product/product';
import { useFocusEffect } from '@react-navigation/native';
import axios from 'axios';

export const Home = (props) => {

    const [categories, setCategories] = useState([]);

    useFocusEffect(
        React.useCallback(() => {
            const unsubscribe = FetchCategoryData();

            return () => unsubscribe();
        }, []) …

在本机反应中，我不能使用类似的东西float:left，float:right所以我想将项目极左和极右对齐，我该怎么做？我在父视图上使用了绝对位置，但在该视图内 flexdirection 和调整之间的内容空间不起作用，为什么会这样？flexbox 和绝对定位不能一起工作吗？

代码：

<View style={styles.cardContent}>
        <View style={{maxWidth: 175}}>
          <Text
            style={{
              fontSize: 16,
              fontWeight: '700',
              padding: 10,
              color: 'white',
            }}>
            {hotelName}
          </Text>
        </View>
        <View style={{flexDirection: 'column', marginLeft: 75}}>
          <Text
            style={{
              fontSize: 20,
              fontWeight: '700',
              padding: 5,
              textAlign: 'right',
              color: 'white',
            }}>
            &#8377; {newRate}
          </Text>
          <Text
            style={{
              fontSize: 16,
              fontWeight: '700',
              textAlign: 'right',
              color: 'white',
              textDecorationLine: 'line-through',
              textDecorationStyle: 'solid',
            }}>
            &#x20b9; {oldRate}
          </Text>
        </View>
      </View>

CSS：

 cardContent: {
    position: 'absolute',
    bottom: 0,
    flexDirection: 'row',
    justifyContent: 'space-between', …

我创建了一个带有一些方法的类，我想模拟该类中的方法，所以我尝试使用spyOn()，但它不起作用，不知道可能出了什么问题？我在spyOn()中使用myClass.prototype而不是myClass，但它仍然不起作用。

class myClass {

    constructor(){

    }

    _methodA () {

    }

    _methodB() {

    }

    main () {
        const res1 = _methodA();
        const res2 = _methodB();
    
    }

}

测试：

it('Testing' , () => {

// Some mock data passed below

    jest.spyOn(myClass.prototype, '_methodA').mockReturnValue(mockData1)
    jest.spyOn(myClass.prototype, '_methodB').mockReturnValue(mockData2)

    const obj = new myClass();
    obj.main();

    expect(myClass._methodA).toHaveBeenCalledTimes(1);
    expect(myClass._methodB).toHaveBeenCalledTimes(1);

});