VUE学习笔记10__vue指令v-on配置method函数

javascript 复制代码
<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Document</title>
</head>
<body>
<div id="app">
    <button @click="conceal_reveal">切换显示隐藏</button>
    <h1 v-show="isShow">helloworld</h1>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
<script>
    const app = new Vue({
            el: '#app',
            data: {
              isShow:true
            },
            methods:{
                conceal_reveal(){
                    this.isShow = !this.isShow
                }
            }
          })
</script>
</body>
</html>

预览

tip:this用来指代当前管理的app,方便书写。

method用来挂载业务逻辑函数

相关推荐
andwhataboutit?8 小时前
smolagent框架
学习
我命由我123458 小时前
Python 开发问题:No Python interpreter configured for the project
开发语言·后端·python·学习·pycharm·学习方法·python3.11
鲨莎分不晴8 小时前
通信学习 (Learning to Communicate):从“心电感应”到“语言涌现”
人工智能·学习·机器学习
惜.己8 小时前
前端笔记(四)
前端·笔记
我命由我123458 小时前
开发中的英语积累 P21:Parentable、Guideline、Manifest、Expire、Condition、Optimize
经验分享·笔记·学习·职场和发展·求职招聘·职场发展·学习方法
老华带你飞8 小时前
农产品销售管理|基于springboot农产品销售管理系统(源码+数据库+文档)
数据库·vue.js·spring boot
一念一花一世界8 小时前
PostIn零基础学习 - 使用自定义权限优化项目管理
学习·postin·接口管理工具
BOF_dcb8 小时前
TCP/IP网络协议
笔记
Lv11770089 小时前
Visual Studio中的常量和只读变量
ide·笔记·c#·visual studio
码界奇点9 小时前
基于Gin+Vue的前后端分离权限管理系统设计与实现
前端·vue.js·车载系统·毕业设计·gin·源代码管理