Vux: Toast dan acara peringatan adalah dua Arah, dan selalu laporkan peringatan saat menggunakan aliran data satu arah vuex

Dibuat pada 3 Mei 2016  ·  12Komentar  ·  Sumber: airyland/vux

Versi: kapan

"vux": "0.0.106"

Android atau iOS, browser yang mana?

Semua

Kode Anda

<toast :show="toast.show">{{toast.msg}}</toast>

Perilaku yang diharapkan dan perilaku yang sebenarnya.

Karena digunakan sebagai komponen global, subkomponennya langsung menggunakan aliran data satu arah vuex untuk memicu pop-up, tetapi toast dan alert show keduanya twoWay, sehingga mereka terus melaporkan peringatan, dan gangguan obsesif-kompulsif tidak nyaman .

Langkah-langkah untuk mereproduksi masalah

Komentar yang paling membantu

Kombinasi vuex+vux juga menemui peringatan yang terikat ke twoWay saat menggunakan komponen Popup. Pada awalnya, saya juga ingin mendengarkan peristiwa ketika ada perubahan!Kemudian saya menemukan solusi baru di sini: properti terhitung

Berikut adalah contoh sederhana

<template>
  <popup :show.sync="showed">
    <group>
      <switch title="just switch" :value.sync="showed"></switch>
    </group>
   </popup>
</template>

<script>
export default {
  vuex: {
    getters: {
      getShow
    },
    actions: {
      updateShow
    }
  },
  computed: {
    showed: {
      get: function () {
        return this.getShow
      },
      set: function (val) {
        this.updateShow(val)
      }
    }
  }
}
</script>

Dibandingkan dengan peristiwa pemantauan, ada lapisan tambahan enkapsulasi atribut perhitungan, tetapi juga mengucapkan selamat tinggal untuk memperingatkan

Semua 12 komentar

Jadi apa saran Anda? TwoWay adalah karena operasi internal komponen akan mengubah pertunjukan, jika tidak, statusnya akan menjadi tidak normal.

twoWay hanya untuk memeriksa apakah itu mengikat dua arah, sekarang untuk memeriksa peringatan waktu

Jadi saya sarankan untuk membatalkan verifikasi pengikatan dua arah, tetapi Anda masih secara otomatis mengubah nilai pertunjukan secara internal, sehingga jika Anda menggunakan dua arah secara eksternal, Anda dapat secara otomatis mengubah nilainya.

Tentu saja, saya di sini untuk mengontrol nilai pertunjukan secara eksternal.

Bagaimana menurut anda?

Bukankah itu hanya memeriksa?

Tentu saja itu hanya memeriksa!

Anda tidak perlu menulis dua arah, tetapi masih terikat oleh sinkronisasi di komponen, dan masih bisa dua arah

Saya baru saja pindah ke VUE selama sebulan, jalannya tidak dalam, saya berharap dapat memberi saran

Seharusnya hanya fungsi verifikasi untuk pengikatan komponen. Jika Anda tidak memerlukan pengikatan dua arah untuk pertunjukan Alert, maka Anda hanya dapat mengubah nilai pertunjukan melalui acara on-hide .

Ya, peringatannya sudah ada. Bersulang, saya mengatur setTimeout untuk mengubah acara terikat. Tentu saja, yang terbaik adalah menyembunyikannya.

Saya juga berpikir toast dan alert tidak terlalu kompatibel dengan vuex. Yang terbaik adalah memiliki event yang disembunyikan dan mempertahankan antarmuka yang sama dengan alert.

@JianleiZhang Akan diimplementasikan pada rilis berikutnya.

Kombinasi vuex+vux juga menemui peringatan yang terikat ke twoWay saat menggunakan komponen Popup. Pada awalnya, saya juga ingin mendengarkan peristiwa ketika ada perubahan!Kemudian saya menemukan solusi baru di sini: properti terhitung

Berikut adalah contoh sederhana

<template>
  <popup :show.sync="showed">
    <group>
      <switch title="just switch" :value.sync="showed"></switch>
    </group>
   </popup>
</template>

<script>
export default {
  vuex: {
    getters: {
      getShow
    },
    actions: {
      updateShow
    }
  },
  computed: {
    showed: {
      get: function () {
        return this.getShow
      },
      set: function (val) {
        this.updateShow(val)
      }
    }
  }
}
</script>

Dibandingkan dengan peristiwa pemantauan, ada lapisan tambahan enkapsulasi atribut perhitungan, tetapi juga mengucapkan selamat tinggal untuk memperingatkan

@pzxbc Cemerlang :smiley:

@pzxbc Saya menemukan bahwa mengirimkan mutasi untuk mengubah nilai getshow, dan kemudian menghitung atribut yang ditampilkan akan meneruskan nilai ke nilai pertunjukan internal komponen popup untuk mengubah status komponen. Di atas adalah yang saya butuhkan, tetapi saya menemukan bahwa atribut perhitungan berikutnya yang ditampilkan akan memanggil fungsi this.updateShow terikat ke set, karena saya menggunakan console.log untuk menemukan bahwa mutaion dipanggil dua kali.

Pendekatan saya adalah:

      set: function (val) {
        if (val === false){
          this.updateAlert(val)
        }
      }
Apakah halaman ini membantu?
0 / 5 - 0 peringkat