реагировать на родной условный рендеринг - PullRequest
Новая
       24

реагировать на родной условный рендеринг

0 голосов
/ 06 декабря 2018

Привет. Итак, я пытаюсь добавить функциональность, которая позволяет пользователю удалять элемент из плоского списка на основе критериев, по которым он был создан.Мой чек if (id.user[0].name === item)

На данный момент у всех либо есть «Удалить», либо ни у одного из них нет.

Мне интересно, возможно ли даже то, что я использую попытку?изменить состояние Swipeout.

 renderItem(item) {
const { id } = this.state;

const swipeBtns = [
  {
    text: 'Delete',
    backgroundColor: 'red',
    underlayColor: 'rgba(0, 0, 0, 1, 0.6)',
    onPress: () => {
      this.deleteNote(item);
    },
  },
];

return (
  <Swipeout
    right={swipeBtns}
    autoClose="true"
    backgroundColor="transparent"
    disabled={this.state.swipeState}
  >
    <ListItem
      onPress={() => this.toggleModalConfirmTrip(item)}
      roundAvatar
      subtitle={item.user[0].name}
      title={`${item.location_from} to ${item.location_to} `}
      rightTitle={item.timeStamp}
      avatar={
        <Image
          source={require('../assests/carLogo.png')}
          style={{ width: 40, height: 50, borderRadius: 10 }}
        />
      }
      containerStyle={{ borderBottomWidth: 0, paddingBottom: 10 }}
    />
  </Swipeout>
);

} 

  renderSwipe = item => {
const { id } = this.state;
this.setState({ item, swipeState: false });
console.warn(item, id);
if (id === item) {
  this.setState({ swipeState: false });
} else {
  this.setState({ swipeState: true });
}

};

У меня вопрос: где я могу запустить эту функцию renderSwipe или есть ли другой способ, которым я могу включить смахивание для некоторых элементов?и отключить на нем других, основываясь на вышеперечисленных условиях.

Спасибо

1 Ответ

0 голосов
/ 06 декабря 2018

Я думаю, что это возможно сделать в вашей функции renderItem, поэтому вам может не потребоваться функция renderSwipe.

Возможно, у вас возникли проблемы с state, так как вы настраивали его для всего компонента.Поэтому, когда вы устанавливаете swipeState в значение false, каждый элемент в списке будет иметь значение swipeState, равное false.

У SwipeOut есть реквизит, называемый disabled, установка этого значения в true отключит функцию свайпа.Тогда все, что вам нужно сделать, это проверить там ваше состояние.

Так что-то вроде этого должно сработать.

<SwipeOut
  ...
  disabled={id.user[0].name !== item} 
>

Таким образом, когда id.user[0].name !== item равно true, свайп будет отключен, а когда он равен false, свайп будет включен.

Просто убедитесь, что вы сравниваете правильные вещи.У меня такое чувство, что вы можете захотеть сравнить id.user[0].name !== item.user[0].name

...