javascript - 如何以 react 形式存储 bool 值？

Question

我想以 react 形式存储 bool 值，其中按钮的值为 true 或 false。这样我就可以访问这些按钮的输入。问题还在于我在此页面中有另一个表单，用于文本输入。所以我真的不知道我是否可以使用该表单两次。

<ion-form  [formGroup]="form" (ngSubmit)="takeBools()">
    <ion-grid>
    <ion-row>
    <ion-col>
        <ion-button  class="button1" (click)="onLoc()" shape="round" [color]="local ? 'light' : 'grey'"> <ion-icon name="pin"></ion-icon> </ion-button>
    <ion-col>
    <ion-row>
    <ion-grid>
</ion-form>

<form [formGroup]="form" (ngSubmit)="addTag()">
    <ion-item>
      <ion-input formControlName="tag" clearInput="true" placeholder="Tags" name="tagValue"></ion-input>
      <ion-button item-right type="submit" icon-only>
      <ion-icon name="checkmark"></ion-icon>
    </ion-button>
    </ion-item>
  </form>

页面.ts

  form: FormGroup;
    public local: boolean = true;
    ...



addTag() { // properly access and reset reactive form values
      const tagCtrl = this.form.get('tag');
      if (tagCtrl.value) {
        this.tagList.push(tagCtrl.value);
        this.tagInput = ''; // in order to have an empty input
      }
    }

        takeBools() {
          const local: boolean = this.form.controls['local'].value;
          console.log(this.local);
        }

      ngOnInit() {
     this.form = new FormGroup({
      tag: new FormControl(null, {
        updateOn: 'submit',
        validators: [Validators.required, Validators.maxLength(20), Validators.minLength(1)]
      }),
      local: new FormControl(true, {    // these bools are not accesable yet
        updateOn: 'submit',
      }),
        })

Answer 1

我认为您想要做的是将 local 的值从 FormGroup 中提取出来。

您可以使用以下代码来做到这一点。

const local: boolean = this.form.controls[‘local’].value;