Question

我很反应原生，我一直在尝试导航。我在自己的.js文件中有4个组件类。 App.js导入stackNavigator。 Movies.js导入另一个名为MoviePopup.js的组件。 MoviePopup.js有一个按钮，我想点击它打开一个确认屏幕（Confirmation.js），并传递一个随机代码。

在App.js中我按如下方式设置了stackNavigator：

bookTicket = () => {
  if (!this.state.chosenTime) {
  Alert.alert('Book Movie Error', 'Please select show time');
  } else {
    this.closeMovie();//close popup

    //I am supposed to navigate to comfirmation window here 
    //and pass a booking code as a prop to the confirmation window
    //What code should I use here to make my navigation work
  }
}

应用程序可以很好地导航到电影页面。在电影里面，我写了一本函数书，游戏（）如下：

<TouchableHighlight
   underlayColor="#9575CD"
   style={styles.buttonContainer}
   onPress={onBook} >

   <Text style={styles.button}>Book My Tickets</Text>

</TouchableHighlight>

我无法导航到此时导航到确认页面。 bookTicket（）函数作为propp传递给Moviepopup.js作为＆＃39; onBook＆＃39;函数并在Moviepopup.js中调用按钮的onPress方法，如下所示：

@Bean
public MongoTemplate mongoTemplate(MappingMongoConverter mappingMongoConverter) throws UnknownHostException {
    return new MongoTemplate(mongoDbFactory(), mappingMongoConverter);
}

我需要帮助编写bookTicket函数才能使导航正常工作。

Answer 1

你不能像这样调用onBook，你需要从组件的道具中获取它：

google.charts.load('current', {
  callback: drawChart,
  packages: ['corechart']
});

function drawChart() {
  $.ajax({
    url: 'livedata.php',
    dataType: 'json'
  }).done(function (results) {
    var data = new google.visualization.DataTable();
    data.addColumn('date', 'time_stamp');
    data.addColumn('number', 'ph');
    data.addColumn('number', 'moist');

    $.each(results, function (i, row) {
      var today = new Date();

      data.addRow([
        new Date(today.getFullYear(), today.getMonth(), row.ts),
        parseFloat(row.ph),
        parseFloat(row.moist)
      ]);
    });

    var chart = new google.visualization.LineChart($('#chart').get(0));
    chart.draw(data, {
      title: 'Soil Analysis'
    });
  });
}

这应该做的工作。如果没有，我们需要查看更多代码

要在单击按钮时将道具传递到另一个屏幕，您只需执行以下操作：

remove-role-from-instance-profile

有关如何使用导航器的更多信息，请访问React Navigation doc

将stack Navigator与导入的组件React-native一起使用

1 个答案: