You've already forked guangan-mp
1.0.0
This commit is contained in:
16
uni_modules/uni-tooltip/changelog.md
Normal file
16
uni_modules/uni-tooltip/changelog.md
Normal file
@ -0,0 +1,16 @@
|
||||
## 0.2.4（2024-04-23）
|
||||
- 修复 弹出位置默认值不一致导致的错位
|
||||
## 0.2.3（2024-03-20）
|
||||
- 修复 弹出位置修正
|
||||
## 0.2.2（2024-01-15）
|
||||
- 新增 placement支持设置四个方向:top bottom left right
|
||||
## 0.2.1（2022-05-09）
|
||||
- 修复 content 为空时仍然弹出的bug
|
||||
## 0.2.0（2022-05-07）
|
||||
**注意：破坏性更新**
|
||||
- 更新 text 属性变更为 content
|
||||
- 更新 移除 width 属性
|
||||
## 0.1.1（2022-04-27）
|
||||
- 修复 组件根 text 嵌套组件 warning
|
||||
## 0.1.0（2022-04-21）
|
||||
- 初始化
|
||||
108
uni_modules/uni-tooltip/components/uni-tooltip/uni-tooltip.vue
Normal file
108
uni_modules/uni-tooltip/components/uni-tooltip/uni-tooltip.vue
Normal file
@ -0,0 +1,108 @@
|
||||
<template>
|
||||
<view class="uni-tooltip">
|
||||
<slot></slot>
|
||||
<view v-if="content || $slots.content" class="uni-tooltip-popup" :style="initPlacement">
|
||||
<slot name="content">
|
||||
{{content}}
|
||||
</slot>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
<script>
|
||||
/**
|
||||
* Tooltip 提示文字
|
||||
* @description 常用于展示鼠标 hover 时的提示信息。
|
||||
* @tutorial https://uniapp.dcloud.io/component/uniui/uni-tooltip
|
||||
* @property {String} content 弹出层显示的内容
|
||||
* @property {String} placement出现位置, 目前支持：left right top bottom
|
||||
*/
|
||||
export default {
|
||||
name: "uni-tooltip",
|
||||
data() {
|
||||
return {
|
||||
|
||||
};
|
||||
},
|
||||
methods: {},
|
||||
computed: {
|
||||
initPlacement() {
|
||||
let style = {};
|
||||
switch (this.placement) {
|
||||
case 'left':
|
||||
style = {
|
||||
top: '50%',
|
||||
transform: 'translateY(-50%)',
|
||||
right: '100%',
|
||||
"margin-right": '10rpx',
|
||||
}
|
||||
break;
|
||||
case 'right':
|
||||
style = {
|
||||
top: '50%',
|
||||
transform: 'translateY(-50%)',
|
||||
left: '100%',
|
||||
"margin-left": '10rpx',
|
||||
}
|
||||
break;
|
||||
case 'top':
|
||||
style = {
|
||||
bottom: '100%',
|
||||
transform: 'translateX(-50%)',
|
||||
left: '50%',
|
||||
"margin-bottom": '10rpx',
|
||||
}
|
||||
break;
|
||||
case 'bottom':
|
||||
style = {
|
||||
top: '100%',
|
||||
transform: 'translateX(-50%)',
|
||||
left: '50%',
|
||||
"margin-top": '10rpx',
|
||||
}
|
||||
break;
|
||||
}
|
||||
return style;
|
||||
}
|
||||
},
|
||||
props: {
|
||||
content: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
|
||||
placement: {
|
||||
type: String,
|
||||
default: 'bottom'
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.uni-tooltip {
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.uni-tooltip-popup {
|
||||
z-index: 1;
|
||||
display: none;
|
||||
position: absolute;
|
||||
background-color: #333;
|
||||
border-radius: 8px;
|
||||
color: #fff;
|
||||
font-size: 12px;
|
||||
text-align: left;
|
||||
line-height: 16px;
|
||||
padding: 12px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
|
||||
.uni-tooltip:hover .uni-tooltip-popup {
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
86
uni_modules/uni-tooltip/package.json
Normal file
86
uni_modules/uni-tooltip/package.json
Normal file
@ -0,0 +1,86 @@
|
||||
{
|
||||
"id": "uni-tooltip",
|
||||
"displayName": "uni-tooltip 提示文字",
|
||||
"version": "0.2.4",
|
||||
"description": "Tooltip 提示文字",
|
||||
"keywords": [
|
||||
"uni-tooltip",
|
||||
"uni-ui",
|
||||
"tooltip",
|
||||
"tip",
|
||||
"文字提示"
|
||||
],
|
||||
"repository": "https://github.com/dcloudio/uni-ui",
|
||||
"engines": {
|
||||
"HBuilderX": ""
|
||||
},
|
||||
"directories": {
|
||||
"example": "../../temps/example_temps"
|
||||
},
|
||||
"dcloudext": {
|
||||
"sale": {
|
||||
"regular": {
|
||||
"price": "0.00"
|
||||
},
|
||||
"sourcecode": {
|
||||
"price": "0.00"
|
||||
}
|
||||
},
|
||||
"contact": {
|
||||
"qq": ""
|
||||
},
|
||||
"declaration": {
|
||||
"ads": "无 ",
|
||||
"data": "无",
|
||||
"permissions": "无"
|
||||
},
|
||||
"npmurl": "",
|
||||
"type": "component-vue"
|
||||
},
|
||||
"uni_modules": {
|
||||
"dependencies": [],
|
||||
"encrypt": [],
|
||||
"platforms": {
|
||||
"cloud": {
|
||||
"tcb": "y",
|
||||
"aliyun": "y",
|
||||
"alipay": "n"
|
||||
},
|
||||
"client": {
|
||||
"Vue": {
|
||||
"vue2": "y",
|
||||
"vue3": "y"
|
||||
},
|
||||
"App": {
|
||||
"app-vue": "y",
|
||||
"app-nvue": "u"
|
||||
},
|
||||
"H5-mobile": {
|
||||
"Safari": "y",
|
||||
"Android Browser": "y",
|
||||
"微信浏览器(Android)": "y",
|
||||
"QQ浏览器(Android)": "y"
|
||||
},
|
||||
"H5-pc": {
|
||||
"Chrome": "y",
|
||||
"IE": "y",
|
||||
"Edge": "y",
|
||||
"Firefox": "y",
|
||||
"Safari": "y"
|
||||
},
|
||||
"小程序": {
|
||||
"微信": "y",
|
||||
"阿里": "u",
|
||||
"百度": "u",
|
||||
"字节跳动": "u",
|
||||
"QQ": "u",
|
||||
"京东": "u"
|
||||
},
|
||||
"快应用": {
|
||||
"华为": "u",
|
||||
"联盟": "u"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
8
uni_modules/uni-tooltip/readme.md
Normal file
8
uni_modules/uni-tooltip/readme.md
Normal file
@ -0,0 +1,8 @@
|
||||
## Badge 数字角标
|
||||
> **组件名：uni-tooltip**
|
||||
> 代码块： `uTooltip`
|
||||
|
||||
数字角标一般和其它控件（列表、9宫格等）配合使用，用于进行数量提示，默认为实心灰色背景，
|
||||
|
||||
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-tooltip)
|
||||
#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839
|
||||
Reference in New Issue
Block a user