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用来挂载业务逻辑函数

相关推荐
布局呆星37 分钟前
Vue3 | 组件通信学习小结
前端·vue.js
炽烈小老头2 小时前
【 每天学习一点算法 2026/04/12】x 的平方根
学习·算法
阿杰学AI2 小时前
AI核心知识115—大语言模型之 自监督学习(简洁且通俗易懂版)
人工智能·学习·ai·语言模型·aigc·监督学习·自监督学习
九英里路3 小时前
OS学习之路——动静态库制作与原理
linux·学习·操作系统·unix·进程·编译·动静态库
red_redemption3 小时前
自由学习记录(160)
学习
南無忘码至尊3 小时前
Unity学习90天-第2天-认识Unity生命周期函数并用 Update 控制物体移动,FixedUpdate 控制物理
学习·unity·游戏引擎
Ruihong4 小时前
你的 Vue 3 reactive(),VuReact 会编译成什么样的 React?
vue.js·面试
Ruihong4 小时前
你的 Vue 3 ref(),VuReact 会编译成什么样的 React?
vue.js·面试
一 乐4 小时前
酒店预订|基于springboot + vue酒店预订系统(源码+数据库+文档)
java·数据库·vue.js·spring boot·论文·毕设·酒店预订系统
报错小能手4 小时前
ios开发方向——swift错误处理:do/try/catch、Result、throws
开发语言·学习·ios·swift