ReactNative Antd-Mobile OnPress и значок не работает
У меня есть два вопроса относительно кода ниже: проект ReactNative и использует antd-mobile для компонента пользовательского интерфейса.
ReactNative:
"dependencies": {
"expo": "^26.0.0",
"react": "16.3.0",
"react-native": "https://github.com/expo/react-native/archive/sdk-26.0.0.tar.gz",
"antd-mobile": "^2.1.8" }
- Иконка не работает
icon={ <Icon type='home' /> }
- Tab.Item OnPress не работает
onPress={ () => this.onChangeTab.bind(this, 'category') }
С терминала expo каждый раз, когда я нажимаю на tab.item, он не регистрирует его.
import React, { Component } from 'react'
import { View, Text } from 'react-native'
import { TabBar, Icon } from 'antd-mobile'
export class TabBarNav extends Component<any, any> {
constructor(props) {
super(props)
this.state = {
selectedTab: 'home'
}
console.log('selectedTab: ' + this.state.selectedTab)
}
renderContent(pageText: any) {
return (
<View style={{ flex: 1, alignItems: 'center', backgroundColor: 'white' }}>
<Text style={{ margin: 50 }}>{pageText}</Text>
</View>
)
}
onChangeTab(tab) {
console.log('Selected Tab: ' + tab)
this.setState({
selectedTab: tab
})
}
render() {
return (
<View>
<TabBar unselectedTintColor='#949494'
tintColor='#33A3F4'
barTintColor='#ccc'
>
<TabBar.Item title='Home'
key='home'
selected={ this.state.selectedTab === 'home' }
onPress={ () => this.onChangeTab.bind(this, 'home') } // This is not working
icon={ <Icon type='home' /> } // This is not working
>
{ this.renderContent('home') }
</TabBar.Item>
<TabBar.Item title='Category'
key='category'
selected={ this.state.selectedTab === 'category' }
onPress={ () => this.onChangeTab.bind(this, 'category') }
icon={ require('../../../artifacts/images/category.png')} // This is working
>
{ this.renderContent('category') }
</TabBar.Item>
</TabBar>
</View>
)
}
}
1 ответ
Из онлайн-примеров ясно, что имена значков не используются в RN, вместо них используются строки юникода для неосновных значков.
Попробуйте
Надеюсь, что это работает!