vue 实现 点击取消监控内容是否发生修改 若修改提示 是否需要保存
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>vue对象变化测试</title> <script src="http://cdn.bootcss.com/vue/1.0.28/vue.js"></script> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.min.js"></script> <style> .active{ color:#f00; } </style> </head> <body> <div id="page"> <!-- tap按钮 --> <div> <button :class="{active:current==1}" @click = "current = 1">按钮01</button> <button :class="{active:current==2}" @click = "current = 2">按钮02</button> </div> <!-- 内容1 --> <div v-if="current == 1"> <input type="text" v-model="msg.name"> <input type="text" v-model="msg.age"> <input type="text" v-model="msg.sex"> </div> <!-- 内容2 --> <div v-if="current == 2"> <input type="text" v-model="text.name"> <input type="text" v-model="text.age"> <input type="text" v-model="text.sex"> </div> <div :do="jc" :do2="jc02">{{jc|json}}---{{jc02|json}}</div> <button @click="cancel">取消</button> </div> <script> var vm = new Vue({ el:'#page', data:{ msg:{}, text:{}, current:1 }, methods:{ cancel:function(){ if(this.jc || this.jc02){ alert("方案基准内容已修改,是否需要保存?") } } }, computed:{ 'jc':function(){ if($.trim(this.msg.name) || $.trim(this.msg.age) || $.trim(this.msg.sex)){ return this.msg; } }, 'jc02':function(){ if($.trim(this.text.name) || $.trim(this.text.age) || $.trim(this.text.sex)){ return this.text; } } } }); </script> </body> </html>
vue 实现 点击取消监控内容是否发生修改 若修改提示 是否需要保存的更多相关文章
- Vue实现点击复制文本内容(原生JS实现)
需求: 实现点击订单编号复制内容 实现步骤: 这里我是在element 的table组件里实现的步骤,仅供参考,实际上实现思路都大同小异 首先在需要点击的地方,添加点击事件 <div class ...
- vue 表格数据编辑,点击取消或者完成按钮后,关闭编辑状态没有及时生效
点击编辑按钮: 编辑状态下,表格可以编辑.但是点击“确认”或者“取消”按钮,列数据编辑状态已经修改,但是视图没有改变. 页面代码: 获取当前行的index,并直接修改当前行用于判断是否编辑状态的数据为 ...
- 华为联运游戏审核驳回:在未安装或需更新HMS Core的手机上,提示安装,点击取消后,游戏卡屏(集成的6.1.0.301版本游戏SDK)
问题描述 更新游戏SDK到6.1.0.301版本之后,游戏包被审核驳回:在未安装或需更新华为移动服务版本(HMS Core)的手机上,提示安装华为移动服务(HMS Core),点击取消,游戏卡屏.修改 ...
- 在使用 vscode 时 eslint 检测 .vue 文件中的less 部分内容
问题: 在使用 vscode 以及 eslint 来检测 基于 webpack 的 vue-cli 的项目中,eslint 无法检测到 .vue 文件中的less 部分内容. 解答: 1.通过 下载 ...
- 点击div全选中再点击取消全选div里面的文字
想做一个就是点击一个div然后实现的功能是div里面的文字都成选中状态,然后就可以利用浏览器的自带的复制功能,任意复制在哪里去了 在网上百度了一下 然后网上的答案感觉很大的范围 然后一些搜索 然后就锁 ...
- [问题] UISearchBar 点击取消后跳动的问题
问题详情: 首先是TableView 作为 NavigationController 的 RootViewContrller, 然后UISearchBar 添加到TableView 的 headV ...
- HTML5--》点击显示隐藏内容
<details>浏览器支持比较差,可以用JavaScript实现这种功能. <!doctype html> <html> <head> <met ...
- vue 如何点击按钮返回上一页
1,vue 如何点击按钮返回上一页呢? 这是vue挂载的范围html代码 <div @click="goOff()">返回</div> 下面是点击返回的方法 ...
- Druid 配置及内置监控,Web页面查看监控内容 【我改】
转: Druid 配置及内置监控,Web页面查看监控内容 1.配置Druid的内置监控 首先在Maven项目的pom.xml中引入包 1 2 3 4 5 <dependency> ...
随机推荐
- SICP 习题 (1.41)解题总结
SICP 习题1.41 看似和周边的题目没有关系,突然叫我们去定义一个叫double的过程,事实上这道题的核心还是高阶函数. 题目要求我们定义一个过程double,它以一个过程作为參数,这个作为參数的 ...
- HDU 5616 Jam's balance 背包DP
Jam's balance Problem Description Jim has a balance and N weights. (1≤N≤20)The balance can only tell ...
- bzoj3436: 小K的农场(差分约束)
3436: 小K的农场 题目:传送门 题解: 查分基础: t==1 a>=b+c t==2 b>=a-c t==3 a>=b+0 b>=a+0 跑最长路一A 代码: #i ...
- SpringMVC+Spring+Hibernate框架整合原理,作用及使用方法
转自:https://blog.csdn.net/bieleyang/article/details/77862042 SSM框架是spring MVC ,spring和mybatis框架的整合,是标 ...
- 51nod 1770 数数字 找规律,注意进位,时间复杂度O(n)
题目: 这题很简单,找规律即可. 考虑两次进位: 1.a*b时的进位. 2.aa*b时加法时进位. 代码: #include <bits\stdc++.h> using namespace ...
- error C2504: 未定义基类
出错的情况为: type.h 文件中定义了一个结构体,但只给出了声明 namespace pcl { struct CSDDSignature; } 其定义在type.hpp文件中给出 namespa ...
- HDU 1087 Super Jumping! Jumping! Jumping!【DP】
解题思路:题目的大意是给出一列数,求这列数里面最长递增数列的和 dp[i]表示到达地点i的最大值,那么是如何达到i的呢,则我们可以考虑没有限制条件时候的跳跃,即可以从第1,2,3,---,i-1个地点 ...
- jq不懂的地方
在循环列表中,获取input标签的值,不能用id获取,用class获取值,通过父级属性找到class,this 指当前点击的位置var UID = $(this).parents("tr&q ...
- 安卓怎么不如ios运行流畅
一.优先级别不同:iOS最先响应屏幕当我们使用iOS或者是Android手机时,第一步就是滑屏解锁找到相应程序点击进入.而这个时候往往是所有操控开始的第一步骤,iOS系统产品就表现出来了流畅的一面,但 ...
- centos7 命令
firewall-cmd --zone=public --add-port=80/tcp --permanent 开启端口 systemctl stop firewalld.service 关闭服务 ...