2016-01-27 3 views
0

творю аккордеон в среагировать-native.I предприняли следующие шаги:Невозможно найти модуль: реагировать-гармошку компонент

1) В моем среагировать родной проект у меня есть установка реагировать-гармошку-компонент с помощи следующий commond:

npm install --save react-accordion-component 

2) Импорт его index.android.js:

'use strict'; 
import React, { 
    AppRegistry, 
    Component, 
    StyleSheet, 
    PropTypes, 
    ToastAndroid, 
    TouchableOpacity, 
    ViewPagerAndroid, 
    Text, 
    View 
} from 'react-native'; 
import { Tab, TabLayout } from 'react-native-android-tablayout'; 
import 'react-accordion-component'; 



class POC extends Component { 

constructor(props) { 
    super(props); 
    this.state = { 
     pagePosition: 0, 
    }; 
    } 



    render() { 

    var Accordion = require('react-accordion-component'); 
var elements = []; 
elements.push({ 
    title: 'Element 1', 
    onClick: function() { 
     alert('Hello World!') 
    }, 
    content: 'Lorem Ipsum...' 
    }); 

elements.push({ 
    title: 'Element 2', 
    onClick: function() { 
    }, 
    content: 'Lorem Ipsum...' 
}); 
    return (
     <View> 
     <TabLayout 
      style={styles.tabLayout} 
      selectedTab={this.state.pagePosition} 
      onTabSelected={_setPagePosition.bind(this)}> 
      <Tab name="S"/> 
      <Tab name="O"/> 
      <Tab name="A"/> 
     <Tab name="p"/> 
     </TabLayout> 
     <ViewPagerAndroid 
      style={styles.viewPager} 
      ref={viewPager => { this.viewPager = viewPager; }} 
      onPageSelected={_setPagePosition.bind(this)}> 
      <View > 
      React.render(<Accordion elements={elements} />, document.getElementById('accordion-example')); 
      </View> 
      <View style={styles.content}> 
      <Text>Tab 2 content</Text> 
      </View> 
      <View style={styles.content}> 
      <Text>Tab 3 content</Text> 
      </View> 
     <View style={styles.content}> 
      <Text>Tab 4 content</Text> 
      </View> 
     </ViewPagerAndroid> 
     </View> 
    ); 
    } 
} 

function _setPagePosition(e:Event) { 
    const pagePosition = e.nativeEvent.position; 
    this.setState({ pagePosition }); 
    // too bad ViewPagerAndroid doesn't support prop updates, 
    // work around by forwarding changes using exposed API 
    this.viewPager.setPage(pagePosition); 
    } 


const styles = StyleSheet.create({ 
    tabLayout: { 
    flex: 1, 
    backgroundColor: '#ddd' 
    }, 
    viewPager: { 
    height: 200, 
    }, 
    content: { 
    padding: 10, 
    } 
}); 

AppRegistry.registerComponent('POC',() => POC); 

Но при запуске на эмуляторе, он дает следующее сообщение об ошибке:

Requiring unknown module "react-accordion-component".

Пожалуйста, помогите решить эту проблему.

ответ

1

Похоже, у вас есть эти два заявления, идущие на:

В верхней части файла:

импорта react-accordion-component

И в визуализации функции:

var Accordion = require('react-accordion-component')

Удалить оператор импорта, и заменить его

var Accordion = require('react-accordion-component')

Итак, она должна в основном выглядеть это сейчас:

'use strict'; 
import React, { 
    AppRegistry, 
    Component, 
    StyleSheet, 
    PropTypes, 
    ToastAndroid, 
    TouchableOpacity, 
    ViewPagerAndroid, 
    Text, 
    View 
} from 'react-native'; 
import { Tab, TabLayout } from 'react-native-android-tablayout'; 
var Accordion = require('react-accordion-component'); 

class POC extends Component { 

constructor(props) { 
    super(props); 
    this.state = { 
     pagePosition: 0, 
    }; 
    } 

    render() { 
    var elements = []; 
    elements.push({ 
     title: 'Element 1', 
     onClick: function() { 
     alert('Hello World!') 
    }, 
    content: 'Lorem Ipsum...' 
    }); 
... 
Смежные вопросы