更新类型为:RCTText的阴影节点中的属性“ fontSize”时出错

时间:2019-11-08 17:13:40

标签: react-native

我已删除node_modules并重新运行npm install。之后,我得到了这个错误:

Error while updating property 'fontSize' in shadow node of type: RCTText
Value for fontSize cannot be cast from String to Double

我将所有fontSize以fontSize:'20'的形式更改为fontSize:20,但错误再次出现。现在,我删除了所有文件中的fontSize属性,再次出现错误。 这是我的package.json内容:

{
"name": "myApp",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "jetifier": "^1.6.4",
    "native-base": "^2.13.8",
    "prop-types": "^15.7.2",
    "react": "16.8.3",
    "react-native": "0.59.8",
    "react-native-dialog": "^5.6.0",
    "react-native-gesture-handler": "^1.5.0",
    "react-native-ionicons": "^4.6.3",
    "react-native-material-dropdown": "^0.11.1",
    "react-native-responsive-screen": "^1.3.0",
    "react-native-slideshow": "^1.0.1",
    "react-navigation": "^3.13.0"
  },
  "devDependencies": {
    "@babel/core": "7.4.4",
    "@babel/runtime": "7.4.4",
    "babel-jest": "24.8.0",
    "jest": "24.8.0",
    "metro-react-native-babel-preset": "0.54.0",
    "react-test-renderer": "16.8.3"
  },
  "jest": {
    "preset": "react-native"
  },
  "rnpm": {
    "assets": [
      "./assets/fonts"
    ]
  }
}

更新: 应用程序的主页:

import React, { Component } from 'react';
import { View, Text,StyleSheet,Image,TouchableWithoutFeedback } from 'react-native';
import Slideshow from 'react-native-slideshow';
import {widthPercentageToDP as wp, heightPercentageToDP as hp} from 'react-native-responsive-screen';
import Colors from '../Colors';
import Strings from '../Strings';
import DrawerNavigator from '../routes/DrawerNavigator';
class AppMainPage extends Component {
  constructor(props) {
    super(props);
    this.state = {
        position: 0,
        interval: null,
        dataSource: [],
        sliderSource:[]
      };
  }
  componentDidMount(){
    this.fetchSliderImage();
  }
  componentWillMount() {
    this.setState({
      interval: setInterval(() => {
        this.setState({
          position: this.state.position === this.state.dataSource.length-1 ? 0 : this.state.position + 1
        });
      }, 2000)
    });
  }

  componentWillUnmount() {
    clearInterval(this.state.interval);
  }
  getAuthAndReload(){
    ajax.fetchAuth().then(()=>{this.fetchSliderImage()});
  }
  async fetchSliderImage(){
    try{
      let response = await fetch(Strings.baseUrl+'spanser/new?type=1&ostanId=1', {
        method: 'POST',
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json',
            'Authorization': 'Bearer ' +Strings.id_token
        }
        }).then((resp) => {
          return resp.json()
      })
      .then((responseJson) => {
        const json_data = responseJson; 
        if("title" in responseJson && responseJson.title=="Unauthorized" ){
          this.setState({loadData:1},()=>this.getAuthAndReload());
          return 0;
        }
        else{
          const arr = Object.keys(json_data).map(function(_) { return json_data[_]; });
          var resultArray=new Array();
          for(i=0;i<arr.length;i++){
            resultArray.push({'title':arr[i].title,'caption':'','url':Strings.imageUrl+arr[i].image1});
          }
            this.setState({sliderSource:resultArray,dataSource:arr});
          return arr;
        }
      });
      } 
    catch (error) {
        console.error(error);
    }
  }
  onImageClick(){
    console.log('&&'+this.state.dataSource[0]);
    console.log('******'+this.state.position);
    this.props.navigation.navigate('SponserPage',{currentItem:this.state.dataSource[this.state.position]})
  }
  render() {
    return (
      <View style={{backgroundColor:'black',flex:1}}>
        <DrawerNavigator/>
        <View style={styles.rowViews}>
            <View style={styles.columnViews}>
                <Image  style={styles.imgStyle} source={require('../Icons/play-button.png')}/>
                <Text style={styles.txtStyle}>ویدیوی ویژه</Text>
            </View>
            <View style={styles.columnViews}>
                <Image  style={styles.imgStyle}  source={require('../Icons/star.png')}/>
                <Text style={styles.txtStyle}>پیشنهادهای ویژه</Text>
            </View>
            <View style={styles.columnViews}>
                <Image  style={styles.imgStyle}  source={require('../Icons/irandokht.png')}/>
                <TouchableWithoutFeedback onPress={()=>this.props.navigation.navigate('SalonList')}>
                  <Text style={styles.txtStyle}>لیست سالنها</Text></TouchableWithoutFeedback>
            </View>
        </View>
        <View style={{width:'100%',height:2,backgroundColor:Colors.yellow}}/>
        <View style={styles.rowViews}> 
            <View style={styles.columnViews}>
                <Image  style={styles.imgStyle}  source={require('../Icons/trophy.png')}/>
                <Text style={styles.txtStyle}>برندگان مسابقات</Text>
            </View>
            <View style={styles.columnViews}>
                <Image  style={styles.imgStyle}  source={require('../Icons/trophy(1).png')}/>
                <Text style={styles.txtStyle}>سالن برتر ماه</Text>
            </View>
            <TouchableWithoutFeedback style={styles.columnViews} onPress={()=>this.props.navigation.navigate('Mosabeqat')}>
            <View >
                <Image  style={styles.imgStyle}  source={require('../Icons/medal.png')}/>
                <Text style={styles.txtStyle}>شرکت در مسابقه </Text>
            </View>
            </TouchableWithoutFeedback>
        </View>
        <View style={styles.rowViews}> 
        <View style={styles.columnViews}>
                <Image  style={styles.imgStyle}  source={require('../Icons/contact.png')}/>
                <Text style={styles.txtStyle}>ارتباط با ایران دخت</Text>
            </View>
            <TouchableWithoutFeedback style={styles.columnViews} onPress={()=>this.props.navigation.navigate('MajaleyeTakhasosi')}>
              <View >
                  <Image  style={styles.imgStyle}  source={require('../Icons/open-magazine.png')}/>
                  <Text style={styles.txtStyle}>مجله تخصصی</Text>
              </View>
            </TouchableWithoutFeedback>

            <View >
                <Image  style={styles.imgStyle}  source={require('../Icons/newspaper.png')}/>
                <TouchableWithoutFeedback style={styles.columnViews} onPress={()=>this.props.navigation.navigate('NewsNav')}>
                  <Text style={styles.txtStyle}>اخبار مهم</Text>
                </TouchableWithoutFeedback></View>
        </View>
        <View  style={styles.columnViews}>
        {this.state.sliderSource.length>0?
          <Slideshow 
          containerStyle={{padding: 10,}}
          dataSource={this.state.sliderSource}
          position={this.state.position}
          resizeMode='contain'
          onPositionChanged={position => this.setState({ position:position })} 
          onPress={()=>{this.onImageClick()}}/>
          :
          <View/>
          }
        </View>
      </View>
    );
  }
}
const styles=StyleSheet.create(
    {
        rowViews:{
            flexDirection:'row',
            justifyContent: 'space-between',
            alignItems: 'center',
            margin:10,
            flex:1
        },
        columnViews:{
            flexDirection:'column',
            justifyContent: 'center',
            alignItems: 'center',
            margin: 5,
        },
        txtStyle:{
            fontFamily: 'BYEKAN',
            color:'white'
        },
        imgStyle:{
            height:hp('20%'),
            width:wp('20%'),
            resizeMode:'contain'
        }
    }
)
export default AppMainPage;

我不知道如何解决错误。谢谢你的帮助 这些是错误的照片: image of error

2 个答案:

答案 0 :(得分:0)

  1. react-native link

  2. 我已删除出现错误的上一行代码,并再次运行服务器并添加代码并运行服务器。

此问题已为我解决。

答案 1 :(得分:0)

在某些地方,您将fontSize从字符串更改为两倍,如果您在某处使用图标,则可能是文本也可能是图标, 我遇到了相同的问题,解决了为使用字体或图标的每个位置提供相同的数据类型