小编hru*_*lok的帖子

如何使用 React 测试库测试 Material UI 选择组件

我正在使用反应测试库进行组件测试。材质 UI 选择选项在弹出窗口中呈现。调试不列出选项。在选择选项的情况下如何触发点击事件。

以下是我选择的组件。

import TextField from '@material-ui/core/TextField';
import { MenuItem } from '@material-ui/core';

<TextField
  select
  id="fruit"
  inputProps={{ id: "fruit" }}
  SelectProps={{
    SelectDisplayProps: {
      'data-testid': "fruit"
    }
  }}
  fullWidth
  variant="outlined"
  {...errors}
>
  {options.map(option => (
    <MenuItem key={option[valueFieldName]} value={option[valueFieldName]}>
      {option[labelFieldName]}
    </MenuItem>
  ))}
</TextField>
Run Code Online (Sandbox Code Playgroud)

什么查询选择器应该用于 onclick 事件。

这是 debug() 记录该字段的方式

    <div class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth">
  <label
    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined"
    data-shrink="false"
    for="fruit"
    id="fruit-label"
  >
    Action on failure
  </label>
  <div class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-fullWidth MuiInputBase-formControl">
    <div
      aria-haspopup="listbox"
      aria-labelledby="fruit-label fruit"
      class="MuiSelect-root MuiSelect-select MuiSelect-selectMenu MuiSelect-outlined MuiInputBase-input …
Run Code Online (Sandbox Code Playgroud)

testing reactjs material-ui react-testing-library

8
推荐指数
1
解决办法
4554
查看次数

导航到上一个屏幕时如何传递参数?

我从屏幕 A 导航到屏幕 B..然后导航回屏幕 A 使用

this.props.navigation.goBack(null);
Run Code Online (Sandbox Code Playgroud)

我想知道我们如何在执行此操作时传递参数?

这是我的代码

 import React, { Component } from 'react';
 import { View, Text, TextInput, ScrollView } from 'react-native';
 import Card from './Card';
 import CardSection from './CardSection';
 import MyButton from './MyButton';


 class Settings extends Component{
 constructor(props){
 super(props);
 this.state = {
   ip:'',
   port:''
 };
}

onSaveClick() {
 console.log('Button clicked');
 this.props.navigation.goBack();
}
render(){
const { input, container } = styles;
return(
  <View style = {container}>
  <Card>
  <CardSection>
    <TextInput 
      style = {input}
      onChangeText = {(ip) => this.setState({ip})} …
Run Code Online (Sandbox Code Playgroud)

javascript react-router react-native react-navigation

5
推荐指数
1
解决办法
2522
查看次数

如何使用react-navigation在react-native android应用程序中单击按钮导航到不同的屏幕

我是本机反应的新手。我正在编写一个android应用程序。除了反应导航之外还有什么其他选项可以实现我所说的导航?另外,如果您能提供演示链接以了解如何为特定于 android 的应用程序实现导航,我将不胜感激。

android react-native react-navigation

2
推荐指数
1
解决办法
1万
查看次数