Rumah > Artikel > hujung hadapan web > vueJS paparan klik mudah dan kesan penyembunyian [kod pelaksanaan]_kemahiran javascript

vueJS paparan klik mudah dan kesan penyembunyian [kod pelaksanaan]_kemahiran javascript

WBOYasal: 2016-05-16 15:02:291740semak imbas

Pada masa ini terdapat terlalu banyak rangka kerja bahagian hadapan yang saya telah terdedah kepada sudut dan bara, dan kini saya mula beralih kepada vue

v-if, v-else, v-show digunakan di sini, v-if boleh menjadikan elemen bukan pada DOM, v-show hanya menukar atribut display:block, saya rasa v-if lebih baik

Berasa dan sesuai,

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>v-if、v-else、v-show</title>
  <script src="../js/vue.js"></script>
  <!--copy from http://vuejs.org.cn/guide/-->
</head>
<body>
  <div id="app">
    <p v-if="willShow">显示显示显示</p>
    <p v-else>隐藏隐藏隐藏隐藏</p>
    <button @click="fn()">改变</button>
  </div>
  <script>
    var vm=new Vue({
      el:"#app",
      data:{
        willShow:true
      },
      methods:{
        fn:function(){
          if(this.willShow==true){
            this.willShow=false;
          }else{
            this.willShow=true
          }
        }
      }
    });
  </script>
</body>
</html>

Paparan klik mudah dan kesan sembunyikan vueJS [kod pelaksanaan] di atas adalah semua kandungan yang dikongsi oleh editor, saya harap ia boleh memberi rujukan kepada anda, dan saya juga berharap semua orang akan menyokong Script Home.

Kenyataan：

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Artikel sebelumnya：Skop JavaScript dan rantai skopArtikel seterusnya：Skop JavaScript dan rantai skop

Artikel berkaitan

Lihat lagi