zoukankan      html  css  js  c++  java
  • Vue

    一 概述

    mv*系列框架

    目前最流行框架:vue react angular

    vue:尤雨溪  个人团队维护 weex

    react:Facebook维护的一套库  React Native

    angular:Google维护的一套库   ionic

    1.x版本:核心是用js开发的

    2.x版本:核心是用ts开发的     ----------TypeScript(js强性语言)

    APP:web app     hybrid app       native app

    移动端布局:盒子模型、弹性盒子
    移动端的数据交互:尽量少操作DOM

    hybrid app(混合开发):cordova(apache)...,目的是为了解决原生App的不能跨平台的问题
    中文文档:http://cordova.axuer.com/

    native app(原生开发):ios开的 android开发

    React Native:通过js去调用原生app技术的api来做开发。学习一次多处使用,并不意味着一次开发多平台运行

    为什么会出现mv*的框架?
    为了解决当下市场对应用程序开发的需求,传统的网站不能满足当下市场的用户体验需求

    二 属性

    Vue2.x是目前前段领域所有mv*框架里性能最好的框架

    Vue.js   vue的主框架

    中文网站:https://cn.vuejs.org/

    所有mv*系列的框架都尽量不操作DOM

    写法:

     <div id="app">{{msg}}</div>

    <script>

      new Vue({

        el :' #app ' ,

         data :{

         msg :' hello Vue!!! ' ;

      }

    })

    </script>

    //输出-------->hello Vue!!!

    el:将当前vue的实例挂载到id为app的元素上面,效果就是我这个div里面的所有东西都归当前这个实例管理

    data:vue对象数据源 (双向绑定)

    methods:vue对象的方法

    computed:计算属性

    三 指令

    扩展了HTML的语法,在Vue中将前缀为v-这种属性称之为指令,其作用就是为DOM元素调用方法、定义行为绑定数据等
    不管是指令也好还是模板语法,里面都是放置表达式

    v-show="boolean":让当前所绑定元素显示或者隐藏
    v-text="数据值": v-text="'么么哒'"
    v-html="数据值": v-html="'么么哒'"
    {{数据值}} :{{'么么哒'}}
    v-loak:避免在客户端显示编程符号
    如果在一个大的容器里面展示非常多的数据的话就用模板语法,同时加上v-cloak
    如果在单个的元素里面展示数据的话,可以采用v-text
    v-on:事件名:用来绑定事件的 简写:@事件名     ------ 推荐
    v-bind:属性名:用来绑定html属性

    v-model:适用于表单元素

    ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

    MVC

    1.mvc是一种应用程序的开发思想,不是设计模式

    2.主要目的是为了解决应用程序展示结构,业务逻辑之间的紧耦合关系

    3.使应用程序的组成分为三部件,每个部件有自己明确的职责,相互之间没有依赖

    M:model(模型)  数据模型负责管理应用程序的数据

    V:view  (视图) 向用户展示数据,以一种特定的格式呈现数据,由控制器决定呈现数据触发

    C:controller (控制器)用来处理用户交互的部分,控制器负责响应于用户输入并执行数据交互模型

    vm:ViewModel   通过双向数据绑定把View层和Model层链接起来,而View和Model之间的同步工作完全自动的,无需人为干涩,因此开发者只需关注业务逻辑,不需要手动操作DOM,不需要关注数据状态的同步问题,复杂的数据状态维护完全由MVVM来统一管理。

    双向数据绑定:

    M<==>V 可以自动将Model和View间的数据同步,数据模型(Model)和视图(View)之间的双向绑定

    缺点:应用场景少

    单项数据绑定:

    M==>V  比如后台的数据量动态的创建DOM节点

    缺点:HTML代码一旦生成后,就没有办法在改变了,如果有新的数据来了,那就必须得把之前的HTML代码去掉,重新生成一次。

     ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

    Vue总结:

    1.Vue最大程度上减少了页面上的DOM操作;

    2.让JS中专注业务逻辑的代码;

    3.通过简单的指令结合页面结构与逻辑数据;

    4.通过自定义指令实现组件化编程;

    5.代码结构更合理;

    6.Vue解放了传统JS中频繁的DOM操作;

                                                                                                  ------------------------(不喜勿喷

  • 相关阅读:
    rpm软件包以及rmp命令
    使用ssh-keygen生成密钥对
    从现有的虚拟机创建vagrant box ,再利用新创建的box创建虚拟机
    EXCEL固定行和列
    URL编码
    标准ASCII码
    base64编码
    http学习--URL字符
    浏览器通过http获取服务器资源的过程
    一名程序员过去10年的程序员生涯,给程序员小弟弟小妹妹们的一些总结性忠告
  • 原文地址:https://www.cnblogs.com/love-8023/p/7742229.html
Copyright © 2011-2022 走看看