Я хочу отключить свою кнопку внутри своих компонентов, когда для одного из моих свойств объекта установлено значение true.

      className="button save"
      disabled={this.props.validationObject.reduce(
        (sum, next) => sum && next,
        true
      )}
    >

Вот мой объект проверки

validationObject: {
    Title: true,
    IBCSegmentId: true,
    CountryId: true,
    localCOMPageTitle: true
  }

Обратите внимание, что для моего инвалида требуется только 1 истина, возможно ли это? Я попробовал "уменьшить", но это не сработало. Я пытался скопировать то, что они здесь сделали

найти сумму логических значений массива объектов JavaScript

1
Hawk 17 Сен 2018 в 01:17

2 ответа

Лучший ответ

Здесь у вас есть объект, поэтому прямое использование reduce или любого другого метода массива в вашей ситуации не работает. Вы можете использовать Object.keys и some, чтобы получить желаемый результат.

const obj = {
    Title: false,
    IBCSegmentId: true,
    CountryId: false,
    localCOMPageTitle: false,
};

const isTrue = Object.keys( obj ).some( el => obj[el] );

console.log( isTrue );
const obj = {
  Title: false,
  IBCSegmentId: true,
  CountryId: false,
  localCOMPageTitle: false
};

class App extends React.Component {
  render() {
    const isTrue = Object.keys(obj).some(el => obj[el]);
    return (
      <button disabled={isTrue}>Foo</button>
      );
  }
}

ReactDOM.render(<App />, document.getElementById("root"));
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<div id="root"></div>
1
devserkan 16 Сен 2018 в 22:29

Вы можете использовать Object.values() для уменьшения значений, а также, вам нужно уменьшить с помощью операции or (||), чтобы оно было ложным, только если все они ложны.

var validationObject = {
    Title: false,
    IBCSegmentId: false,
    CountryId: false,
    localCOMPageTitle: false
  };

var shouldDisable = Object.values(validationObject).reduce(
       (sum, next) =>sum || next
      );
   
console.log(shouldDisable);


validationObject = {
    Title: true,
    IBCSegmentId: false,
    CountryId: false,
    localCOMPageTitle: false
  };

shouldDisable = Object.values(validationObject).reduce(
       (sum, next) =>sum || next
      );
console.log(shouldDisable);
2
Ruzihm 16 Сен 2018 в 22:32