文档章节

SPA和MVVM设计思想

达达前端
 达达前端
发布于 2019/09/07 07:39
字数 469
阅读 10
收藏 0

Vue基础篇 设计模式 SPA MVVM Vue简介 Vue的页面基本使用 Vue的全局环境配置 基本交互

插值表达式 基础指令

v-text
v-html
v-pre
v-once
v-cloak
v-on

file

file

MVVM mvvm:model-view-viewModel 模型,视图,视图模型

模型:指的是构成页面内容的相关数据 包含:前端定义的数据,后端传递的数据 视图:指的是呈现给开发这和用户查看的展示数据的页面 视图模型:mvvm设计模式的核心思想,它是连接view和model的桥梁

model数据,view-model视图数据模型,view视图

前端实现mvvm设计思想的框架,其目的都是为了高度封装view-model的交互过程,让开发这只关心页面构成和数据构成,无需花费大量时间关心数据和页面的状态关系

vue是一套用于构建用户界面的渐进式框架

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width-device-width, initial-scale=1.0">
 <meta http-equiv="X-UA-Compatible" content="ie=dege">
 <title>Document</title>
 <script>
  var msg = "msg变量";
	window.onload = function() {
	 var h4Dom = document.getElementById("h4Dom");
	 var inputDom = document.getElementById("inputDom");
	 h4Dom.innerHTML = msg;
	 inputDom.value = msg;
	 inputDom.addEventListener("input",function(){
	  console.log(this);
	 })
	  }
		function print(arg) {
		 console.log(arg);
		}
		</script>
</head>
<body>
<div>
<h4 id="h4Dom"></h4>
<input type="text" value="" id="inputDom">
</div>
</body>
</html>

file


若本号内容有做得不到位的地方(比如:涉及版权或其他问题),请及时联系我们进行整改即可,会在第一时间进行处理。


请点赞!因为你们的赞同/鼓励是我写作的最大动力!

欢迎关注达叔小生的简书!

这是一个有质量,有态度的博客

博客

© 著作权归作者所有

达达前端
粉丝 4
博文 226
码字总数 368531
作品 0
广州
程序员
私信 提问
加载中

评论(0)

React生态渐进系列-React-Router

首先,确实很久没有写过文章了,感觉很多东西需要重新梳理一遍,所以首先从React项目的基础生态圈,开始慢慢的梳理这些前端项目的知识点.这次便详细的梳理一下路由的知识点. 单页应用(SPA) 提到前...

pacopc
2018/07/31
0
0
vue轻量高效的前端组件化方案以及MVC MVVM思想

近些年来前端的发展的趋势: 旧浏览器逐渐被淘汰,移动端需求增加,旧浏览器是指ie6-ie8是不支持es5的,而vuejs利用了Object.defineProperty特性,es5在移动端和pc端也都是支持的,所以vuejs...

这是雪儿杨啊
2018/12/10
0
0
浅谈移动端页面无刷新跳转问题的解决方案

浅谈移动端页面无刷新跳转问题的解决方案 2017-12-22 祈澈姑娘 最近开发微信公众号,用的框架是 一般的 UI,但是涉及到多页面之间的相互跳转的问题,降低了浏览器的性能,用户体验特别不好,...

祈澈姑娘
2017/12/22
0
0
Omi 入坑指南 The second floor 初步接触

Omi 已经出了 5.0 版本,由于新手,我们还是使用官方提供的 Cli 去安装,安装完毕后你会发现还是Omi 4.0的那个版本 在中提供了4中开发的项目模板 模板 Command 基础模板 omi init my-app 使用...

傻梦兽
2018/11/28
0
0
mnv*框架开发时代

原文出处:极限前端   当下前端开发框架设计显然已经在mvvm方式上又发展了一步, 提出不久,使用前端代码来调用native的思路就开始被实践。相信大家也知道是什么东西。到了今天,我们不得不...

ouven
2016/06/25
516
0

没有更多内容

加载失败,请刷新页面

加载更多

USB Type-C的基本原理

1 USB Type-C的基本原理 1.1 基本特性 Figure 1-1 USB Type-C接头外形 USB Type-C(简称USB-C)的基本特性: 1. 接口插座的尺寸与原来的Micro-USB规格一样小,约为8.3mm X 2.5mm 2. 可承受1...

osc_jklrr90y
6分钟前
11
0
浅谈STM32串口通信(一)基本介绍和一个字节传输的实现

文章目录 0 传输引脚 1 传输一个字节 1.1 发送一个字节 1.2 接收一个字节 2 代码 2.1 配置 2.2 发送一个字节 2.3 接收一个字节 0 传输引脚 串口收发共需要三根线 其中,TX脚为发送引脚, RX脚为...

osc_bzc91lgy
7分钟前
17
0
CubeMX STM32H7配置FreeRTOS

(RTOS笔记1)CubeMX STM32H7配置FreeRTOS 软硬件版本信息: CubeMX配置 1.选择芯片的型号 2.配置时钟(Clock Configuration) 3.配置FreeRTOS的时基定时器(将在RTOS笔记2中介绍),用TIM2作为...

osc_61miaq6u
8分钟前
15
0
使用RT-Thread 系统实现DIY数字仪表(四)——同步网络时间

目录: 1.使用RT-Thread 系统实现DIY数字仪表(一)——STM32CUBMX5.6移植touchGFX4.13 2.使用RT-Thread 系统实现DIY数字仪表(二)——把TouchGFX移植到RTThread系统 3.使用RT-Thread 系统实...

osc_d8v3gwtb
8分钟前
20
0
jdk8新特性之七 Nashorn JavaScript

引言 Nashorn 一个 javascript 引擎。 从JDK 1.8开始,Nashorn取代Rhino(JDK 1.6, JDK1.7)成为Java的嵌入式JavaScript引擎。Nashorn完全支持ECMAScript 5.1规范以及一些扩展。它使用基于JSR...

阿丹博客-adanblog
9分钟前
14
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部