jsx-vue2
jsx-vue2 copied to clipboard
To give a ref to the JSX Element but I cannot get it by $refs. why?
There is a table, and the function below is to render a Poptip in the table. and whatever I give the div
ref or give the Poptip
ref. when I am getting it in the context of Table's Vue, I will get undefined.
function createUniquePoptip(){
let poper = null
return function (h, holdConent, slotContent) {
if(poper) return
poper = <div ref="aaa">
<Poptip v-poptip="poptip" trigger="hover" placement="bottom" transfer={true} width="380">
{ holdConent }
{ slotContent }
</Poptip>
</div>
return poper
}
}
This is the Table Vue. I get 'poptip' by this.$refs
and I always get undefined
.
<template>
<div class="table-wrap">
<i-table :columns="column" :data="data"></i-table>
</div>
</template>
<script>
import Mixins from './table.js'
export default {
name: "Mtable",
mixins: [Mixins],
props: {
type: {
type: String,
default: 'default'
}
},
data(){
return {
column: [],
data: [{candidateName:123,jobName:"ne", action: '覆盖'}]
}
},
created() {
this.column = this.createColumns()
},
mounted() {
console.log("poptipMouseEnter=====", this.$refs)
},
}
</script>
The function, createUniquePoptip, is in the Mixins. At the end, Thanks in advance.