React Native - Как повторно использовать файлы?
В Java все переменные, которые вы объявляете, на самом деле являются «ссылками» на объекты (или примитивы), а не самими объектами.
При попытке выполнить один метод объекта , ссылка просит живой объект выполнить этот метод. Но если ссылка ссылается на NULL (ничего, нуль, void, nada), то нет способа, которым метод будет выполнен. Тогда runtime сообщит вам об этом, выбросив исключение NullPointerException.
Ваша ссылка «указывает» на нуль, таким образом, «Null -> Pointer».
Объект живет в памяти виртуальной машины пространство и единственный способ доступа к нему - использовать ссылки this. Возьмем этот пример:
public class Some {
private int id;
public int getId(){
return this.id;
}
public setId( int newId ) {
this.id = newId;
}
}
И в другом месте вашего кода:
Some reference = new Some(); // Point to a new object of type Some()
Some otherReference = null; // Initiallly this points to NULL
reference.setId( 1 ); // Execute setId method, now private var id is 1
System.out.println( reference.getId() ); // Prints 1 to the console
otherReference = reference // Now they both point to the only object.
reference = null; // "reference" now point to null.
// But "otherReference" still point to the "real" object so this print 1 too...
System.out.println( otherReference.getId() );
// Guess what will happen
System.out.println( reference.getId() ); // :S Throws NullPointerException because "reference" is pointing to NULL remember...
Это важно знать - когда больше нет ссылок на объект (в пример выше, когда reference и otherReference оба указывают на null), тогда объект «недоступен». Мы не можем работать с ним, поэтому этот объект готов к сбору мусора, и в какой-то момент VM освободит память, используемую этим объектом, и выделит другую.
1 ответ
Выполните следующие шаги:
Создайте файл, например: Header.js
import React, { Component } from 'react'
import { Text, View } from 'react-native'
class Header extends Component {
render() {
return (
<View>
<Text> Header Component </Text>
</View>
)
}
}
экспортируйте этот компонент или функцию для повторного использования в других файлах.
export default Header;
экспортируя эту функцию или класс, вы можете импортировать ее в любой файл js, используя это:
import Header from './Header.js'
ИЛИ
import Header from './Header'
Здесь Вот как вы можете использовать этот импортированный компонент в других файлах:
import React, { Component } from 'react'
import { Text, View } from 'react-native'
import Header from './Header' // import that
class App extends Component {
render() {
return (
<View>
<Header /> // use like this
<Text> textInComponent </Text>
</View>
)
}
}
Если у вас есть несколько компонентов или функция для экспорта в один файл, вы не можете использовать export default во всем этом. вам просто нужно использовать только export.
вот так: Common.js файл
export Header;
export Button;
или вы можете использовать это так.
import { Header, Button } from './Common';