由于最近项目需求,用上了mint-ui来重构移动端页面,从框架本身来讲我觉得很强大了,用起来也很不错,但是文档就真的是,,,,让我无言以对,给的api对于我们这些小菜鸟来讲真的是处处是坑呀(ps:用vue的主要目的是方便数据双向绑定,所以并没有配置vue的环境,webpack,node等)

mint-ui Toast

官网文档示例:

 Toast({
message: 'Upload Complete',
position: 'bottom',
duration: 5000
});

实际应用:

 this.$toast({
message: '提示信息',
position: 'middle',
duration: 3000
});

mint-ui MessageBox

官网文档示例:

 MessageBox({
title: 'Notice',
message: 'Are you sure?',
showCancelButton: true
});

实际应用:

 this.$messagebox.confirm('确定执行此操作?')
.then(action => {
this.cancel = false;
})
.catch(action => {
this.cancel = true;
});

mint-ui Field

mt-field type="date"初始化的时候预置值格式

 <template>
<mt-field label="birthday" placeholder="Input birthday" type="date" v-model="birthday"></mt-field>
</tempalte>
<script>
export default{
data(){
return{
birthday:'2017-06-12'
}
},
methods:{}
}
</script>

mint-ui Switch

事件change ,API文档里面写返回一个checked:boolen值,但是直接在change事件里面取出来的checked值却和mt-switch绑定的value相反,所以还是只能监听value的变化

mint-ui vue双向绑定的更多相关文章

  1. vue双向绑定的原理及实现双向绑定MVVM源码分析

    vue双向绑定的原理及实现双向绑定MVVM源码分析 双向数据绑定的原理是:可以将对象的属性绑定到UI,具体的说,我们有一个对象,该对象有一个name属性,当我们给这个对象name属性赋新值的时候,新值 ...

  2. IOS自带输入法中文不触发KEYUP事件导致vue双向绑定错误问题

    先上图: 可以看到输入框中的内容和弹出框的内容不一致, <input class="am-fr labRight" id="txcode" type=&q ...

  3. Vue双向绑定原理,教你一步一步实现双向绑定

    当今前端天下以 Angular.React.vue 三足鼎立的局面,你不选择一个阵营基本上无法立足于前端,甚至是两个或者三个阵营都要选择,大势所趋. 所以我们要时刻保持好奇心,拥抱变化,只有在不断的变 ...

  4. 梳理vue双向绑定的实现原理

    Vue 采用数据劫持结合发布者-订阅者模式的方式来实现数据的响应式,通过Object.defineProperty来劫持数据的setter,getter,在数据变动时发布消息给订阅者,订阅者收到消息后 ...

  5. vue双向绑定原理分析

    当我们学习angular或者vue的时候,其双向绑定为我们开发带来了诸多便捷,今天我们就来分析一下vue双向绑定的原理. 简易vue源码地址:https://github.com/jiangzhenf ...

  6. vue双向绑定原理及实现

    vue双向绑定原理及实现 一.总结 一句话总结:vue中的双向绑定主要是通过发布者-订阅者模式来实现的 发布 订阅 1.单向绑定和双向绑定的区别是什么? model view 更新 单向绑定:mode ...

  7. vue双向绑定原理源码解析

    当我们学习angular或者vue的时候,其双向绑定为我们开发带来了诸多便捷,今天我们就来分析一下vue双向绑定的原理. 简易vue源码地址:https://github.com/maxlove123 ...

  8. Vue双向绑定实现原理demo

    一.index.html <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> ...

  9. Vue双向绑定原理(源码解析)---getter setter

       Vue双向绑定原理      大部分都知道Vue是采用的是对象的get 和set方法来实现数据的双向绑定的过程,本章将讨论他是怎么利用他实现的. vue双向绑定其实是采用的观察者模式,get和s ...

  10. Vue双向绑定原理及其实现

    在之前面试的时候被面试官问到是否了解Vue双向绑定的原理,其实自己之前看过双向绑定的原理,但也就是粗略的了解,但是没有深入.面试官当时让我手写一个原理,但是就蒙了

随机推荐

  1. vue.js基础知识篇(4):过滤器、class与style的绑定2

    代码下载:网盘 欢迎私信 第一章:过滤器 过滤器是对数据进行处理并返回结果的函数. 1.语法 语法是使用管道符"|"进行连接.过滤器可以接收参数,跟在过滤器后面,带引号的参数被当做 ...

  2. Linux Command Line learning

    https://www.codecademy.com/en/courses/learn-the-command-line Background The command line is a text i ...

  3. 如何编写更好的SQL查询:终极指南-第二部分

    上一篇文章中,我们学习了 SQL 查询是如何执行的以及在编写 SQL 查询语句时需要注意的地方. 下面,我进一步学习查询方法以及查询优化. 基于集合和程序的方法进行查询 反向模型中隐含的事实是,建立查 ...

  4. macaca 测试web(3)

    上回书说到 macaca 测试web(2)  使用ddt做参数驱动化, 有些人会说,你好low,我说怎么low呢,他说你看看你的脚本就放在一个文件里,对于我们小白来说,这看起来很乱啊,能不能给我拆分, ...

  5. Mysql中使用聚合函数对null值的处理

    平时因为对于数据库研习的不深,所以在面试的时候问了一些平常遇到过的问题居然没法很肯定地回答出来,实在让自己很恼怒! 这次让我记忆深刻的一个问题是: 在mysql中使用聚合函数的时候比如avg(t),t ...

  6. 编译安装httpd 2.4

    author:JevonWei 版权声明:原创作品 官方网站下载httpd2.4.apr及apr-util的相关软件包,并传输到centos 7系统中的/usr/local/src(apr1.6版本过 ...

  7. 浅析SQL Server在可序列化隔离级别下,防止幻读的范围锁的锁定问题

    本文出处:http://www.cnblogs.com/wy123/p/7501261.html (保留出处并非什么原创作品权利,本人拙作还远远达不到,仅仅是为了链接到原文,因为后续对可能存在的一些错 ...

  8. 如何实现一个 Virtual DOM 及源码分析

    如何实现一个 Virtual DOM 及源码分析 Virtual DOM算法 web页面有一个对应的DOM树,在传统开发页面时,每次页面需要被更新时,都需要手动操作DOM来进行更新,但是我们知道DOM ...

  9. JavaScript中你所不知道的Object(一)

    Object实在是JavaScript中很基础的东西了,在工作中,它只有那么贫瘠的几个用法,让人感觉不过尔尔,但是我们真的了解它吗? 1. 当我们习惯用 var a = { name: 'tarol' ...

  10. 201521123107 《Java程序设计》第13周学习总结

    第13周-网络 1.本周学习总结 2.书面作业 1. 网络基础 1.1 比较ping www.baidu.com与ping cec.jmu.edu.cn,分析返回结果有何不同?为什么会有这样的不同? ...