Блог

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

Во-первых, как я могу привязать событие «checkedChange» ко всем элементам Switch в этом списке сразу, после загрузки или перезагрузки списка (а не к каким-либо другим элементам Switch на этой странице)?

Во-вторых, переключатель назначения должен быть включен только в том случае, если установлен флажок участия, или отключен и снят флажок другим способом. Как этого можно добиться хорошим способом?

В-третьих, событие запускает функцию, которая должна сохранять изменения. Как я должен получить информацию о типе (задействовать или назначить) и идентификаторе пользователя?

Пример скриншота

Для уточнения:

Я знаю о методе присвоения элементу switch идентификатора и привязки его статически, например:

  const mySwitch = page.getViewById("mySwitch");
 mySwitch.on("checkedChange", (args) => {
   // Do something
 });
  

и

 <Switch id="mySwitch" .../>
  

Но в этом случае я загружаю список пользователей из API, используя ViewModel и observableArray. Каждая запись содержит два элемента Switch, и присвоение им уникальных идентификаторов и привязка каждого из них кажется плохим решением.

Если бы это было веб-приложение, я бы добавил дополнительные атрибуты к элементу Switch, например:

 <Switch data-type="user-involvement" data-uid="10" .../>
  

и изменения коллективной привязки ко всем элементам, где тип данных — «участие пользователя».

Есть ли какой-либо способ сделать что-то подобное в ядре {N}?

• Если вы используете версию ядра {N}, то вы должны иметь возможность добавлять checkedChange прослушиватель при loaded событии Switch .

• В checkedChange событии Switch вы могли бы обновить checked свойство other Switch , обновив наблюдаемый атрибут, с которым он связан.

Я здесь создал для вас пример игровой площадки. При начальной загрузке в youe XML у вас может быть 2 переключателя, и вы можете управлять вторым переключателем на основе состояния первого переключателя.

   <Switch checked="{{involved}}" loaded="switchLoaded" />
  <Switch checked="{{assigned}}" isEnabled="{{involved}}" />
  

находясь в вашем js-файле.

 countries: [
      { name: "User 1", involved: true, assigned: false },
      { name: "User 2", involved: true, assigned: false },
      { name: "User 3", involved: false, assigned: false },
      { name: "User 4", involved: true, assigned: false },
      { name: "User 5", involved: true, assigned: false },
    ],
  

Также вы можете привязать слушателей к загруженному методу.

 function switchLoaded(args) {
  console.log(args.object.bindingContext);
  args.object.on("checkedChange", (args) => {
    console.log("checkedChange ", args.object.checked);
  });
}
  

В args.object.BindingContext у вас есть доступ к данным, которыми вы можете управлять.