huanld/vue-tippy
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update App.vue

Browse Source
This commit is contained in:
Georges KABBOUCHI
2021-01-01 02:19:19 +02:00
parent 1e06a5a779
commit de90fc5b12
1 changed files with 25 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files
playground-vue2/src/App.vue
+25 -25
View File
@@ -109,7 +109,7 @@ function useMousePosition() {
export default defineComponent({
setup() {
const counter = ref(0)
window.counter = counter;
const button = ref()
const button2 = ref()
const button3 = ref()
@@ -173,32 +173,32 @@ export default defineComponent({
options.content = String(parseInt(options.content) + 1)
}
// const { x, y } = useMousePosition()
const { x, y } = useMousePosition()
// const { tippy } = useTippy(() => document.body, {
// content: computed(() => `(${x.value},${y.value})`),
// showOnCreate: true,
// trigger: 'manual',
// // sticky: true, // slow?
// placement: 'top',
// hideOnClick: false,
// arrow: `<svg style="color: black;width:20px;height:20px" fill="currentColor" viewBox="0 0 20 20"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-8.707l-3-3a1 1 0 00-1.414 0l-3 3a1 1 0 001.414 1.414L9 9.414V13a1 1 0 102 0V9.414l1.293 1.293a1 1 0 001.414-1.414z" clip-rule="evenodd"></path></svg>`,
// getReferenceClientRect: function () {
// return {
// width: 0,
// height: 0,
// top: y.value,
// right: x.value,
// bottom: y.value,
// left: x.value,
// }
// },
// })
const { tippy } = useTippy(() => document.body, {
content: computed(() => `(${x.value},${y.value})`),
showOnCreate: true,
trigger: 'manual',
// sticky: true, // slow?
placement: 'top',
hideOnClick: false,
arrow: `<svg style="color: black;width:20px;height:20px" fill="currentColor" viewBox="0 0 20 20"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-8.707l-3-3a1 1 0 00-1.414 0l-3 3a1 1 0 001.414 1.414L9 9.414V13a1 1 0 102 0V9.414l1.293 1.293a1 1 0 001.414-1.414z" clip-rule="evenodd"></path></svg>`,
getReferenceClientRect: function () {
return {
width: 0,
height: 0,
top: y.value,
right: x.value,
bottom: y.value,
left: x.value,
}
},
})
// watch([x, y], () => {
// if (tippy.value && tippy.value.popperInstance)
// tippy.value.popperInstance.update()
// })
watch([x, y], () => {
if (tippy.value && tippy.value.popperInstance)
tippy.value.popperInstance.update()
})
const singleton1 = ref()
const singleton2 = ref()