1_3 MVP传统模式：view present model 比较MVVM

最新推荐文章于 2023-08-14 15:17:50 发布

上晴下雪

最新推荐文章于 2023-08-14 15:17:50 发布

阅读量147

点赞数

文章标签： js vue javascript jquery

本文链接：https://blog.csdn.net/xueerkeji/article/details/106041013

版权

MVP传统模式：view present model 比较MVVM

<!DOCTYPE html>
<html>
<head>
	<title>MVP传统模式：view present model 比较MVVM</title>
	<script src="https://cdn.jsdelivr.net/npm/vue"></script>
	<script type="text/javascript" src="https://common.cnblogs.com/scripts/jquery-2.2.0.min.js"></script>
</head>
<body>
	<div id="app">
		<input type="text" id='input' />
		<button id="btn">提交</button>
		<ul id="list"></ul>
	</div>
	<script type="text/javascript">
		//定义方法Page
		function Page(){

		}
		//jQuey extend()函数用于将一个或多个对象的内容合并到目标对象（第一个参数）
		//prototype属性允许对象添加属性和方法
		$.extend(Page.prototype,{
			init:function(){
				this.bindEvents();
			},
			bindEvents:function(){
				var btn= $('#btn');
				//$.proxy方法接受一个已有函数，并返回一个带有特定上下方的新函数
				btn.on('click',$.proxy(this.handleBtnClick,this))
			},
			handleBtnClick:function(){
				var input=$('#input');
				$('#list').append('<li>'+input.val()+'</li>');
				input.val('');
			}
		});
		var page=new Page();
		page.init();
	</script>
</body>
</html>

上晴下雪

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
1_3 MVP传统模式：view present model 比较MVVM

MVP传统模式：view present model 比较MVVM<!DOCTYPE html><html><head> <title>MVP传统模式：view present model 比较MVVM</title> <script src="https://cdn.jsdelivr.net/npm/vue"></script> <script type="text/javascript" src="
复制链接

扫一扫