React Native之最构建对象通过构造方法传递值然后再获取值

1 问题

在一个文件构建一个对象,然后在另外一个文件里面new这个对象,通过构造方法传递参数,然后再获取这个参数

 

 

 

2 测试代码

Student.js文件如下

'use strict';

import React from 'react'

import {NativeModules,NativeEventEmitter,DeviceEventEmitter,Alert} from 'react-native'

class Student {
    constructor(name: string) {
	this.name = name;
    }
    _getName = () => {
	console.log("_getName");
	return this.name;
    };
}

export default Student

这里我们可以直接在构造方法里面写this.name,而且不需要声明,但是在java里面肯定是要声明 name才行.

 

App.js文件如下

import React from 'react';
import {View,Text} from 'react-native';

import Student from "./Student";

export default class App extends React.Component {
        
       constructor(props) {
          super(props); 
          this.state = {name: '点击我'};
       }

       render() {
          return (
            <View style={{flex: 1,alignItems: 'center',justifyContent: 'center'}}>
              <Text
        	  onPress={() => this._press()}
               >{this.state.name}</Text>
            </View>
          );
       }

       _press = () => {
           console.log("HomeScreen press");
           let student = new Student("chenyu");
           let StudentName = student._getName();
	   console.log("name is:" + StudentName);
	   this.setState({name: StudentName});
       }
}

 

3 运行结果

一开始的效果

然后 点击"点击我"效果如下

相关文章

这篇文章主要讲解了“FlutterComponent动画的显和隐怎么实现...
这篇文章主要讲解了“flutter微信聊天输入框功能如何实现”,...
本篇内容介绍了“Flutter之Navigator的高级用法有哪些”的有...
这篇文章主要介绍“Flutter怎么使用Android原生播放器”,在...
Flutter开发的android端如何修改APP名称,logo,版本号,具体...
Flutter路由管理初识路由概念一.路由管理1.1.Route1.2.Mater...