依赖于 Vue2.x 的简单简洁的信息提示框,支持移动端。
HTML Vue JavaScript
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
dist
src
.babelrc
.gitignore
LICENSE
README.md
README.zh_CN.md
index.html
package.json
rollup.config.js

README.md

Vue-Tooltips Vue 2.x

English | 中文

Demo

http://demo.webjyh.com/vue-tooltips

http://webjyh.qiniudn.com/vue_tooltips_qrcode.png

Build

# or `npm i rollup -g` for short
npm install rollup --global

# install dependencies
npm install

# build for production with minification
npm run build

Install

# npm install
npm install vue-tooltips --save-dev

# or download vue-tooltips.js
https://github.com/webjyh/vue-tooltips/releases

Use

// *.vue file
import Vue from 'vue';
import 'vue-tooltips/dist/tooltips.css';
import Tooltips from 'vue-tooltips';

Vue.use(Tooltips);

export default {
    data() {
        return {}
    },
    mounted() {
        this.$tooltips('vue-Tooltips !!!');
    }
}
*.js file

<!-- css -->
<link rel="stylesheet" href="dist/tooltips.css">

<!-- js -->
<script src="//cdn.bootcss.com/vue/2.3.4/vue.js"></script>
<script src="dist/tooltips.min.js"></script>
<script>
new Vue({
    el: '#app',
    data: function() {
        return {}
    },
    mounted: function() {
        this.$tooltips('vue-Tooltips !!!');
    }
});
</script>

Example

this.$tooltips('Tooltips !!!');

// set duration
this.$tooltips('Tooltips !!!', 5000);

// set Options
this.$tooltips('Tooltips !!!', {
    type: 'danger',
    duration: 3000,
    callback: function() {
        alert(1);
    }
});

/* type = 'success' */
this.$tooltips.success(msg, [, options]);

/* type = 'warning' */
this.$tooltips.warning(msg, [, options]);

/* type = 'danger' */
this.$tooltips.error(msg, [, options]);

Options

Attribute Default Type Description
type success {String} message type default, success, warning, danger
duration 3000 {Number} display duration, millisecond. default 3000 ms.
callback function() {Function} callback function when closed with the message instance as the parameter

Author

M.J