has not been called many times. Has anyone ever encountered this situation?
components component
< el-table-column
: width= "width"
: prop= "propChild"
: label= "label"
: editable= "editable"
: render-header= "renderHeader"
: fixed= "fixed" / / this attribute causes renderHeader functions to be called one more time
: search= "search"
: popover= "popoverChild"
: fieldExtra= "fieldExtra"
: param= "paramChild"
: callback= "callback=" > < callback > < / br > < /
renderHeader (createElement, {column,$index}) {/ / this is judged by type
if(this.search === true){
if(this.renderType === 3 || this.renderType === 7){
return this.renderInput(createElement,{column,$index})
}
else if(this.renderType === 5){
return this.renderCheckboxSelect(createElement,{column, $index})
}
else if(this.renderType === 6){
return this.renderDate(createElement,{column, $index})
}
}else{
return column.label
}
},
renderCheckboxSelect (createElement, {column, $index}) {/ / build header multiple select box
return createElement(
"div",
{
class:"filters",
style:{
//
padding: "0",
overflow: "visible"
}
},
[
column.label,
createElement(
"el-popover",
{
props:{
placement: "bottom",
width: "273",
trigger: "click",
popperClass: "popover-search",
value: this.popoverChild
}
},
[
createElement(
"el-select",
{
class:"filter-select",
props:{
placeholder: this.placeholder,
popperClass: "phase-select",
multiple: true,//render
value: this.paramChild,
clearable: this.isClear,
},
on:{
input: value => {
console.log(value)
this.paramChild = value
this.callback && this.callback()
}
}
},
[
this.fieldExtra.template.items.map(item => {
return createElement(
"el-option",
{
props:{
value: item.content,
label: item.content
},
key: item.content
}
)
})
]
),
createElement(
"a",
{
domProps:{
innerHTML: "",
},
style:{
cursor:"pointer",
marginLeft:"5px",
color: "-sharp55a3f8",
},
on:{
click: () => {
let paramVal = {
field_key: this.prop,
value: this.paramChild,
label: column.label
}
console.log(paramVal)
this.popoverChild = false
this.$emit("paramBack", paramVal)
}
}
}
),
createElement(
"i",
{
slot: "reference",
class: this.filterIcon,
style:{
cursor:"pointer",
marginLeft:"5px"
},
on:{
click:() => {
this.popoverChild = true
}
}
}
)
]
)
]
)
},
/ / here is my reference component
<vue-SearchColumn
v-for="item in projectInvestorHeaderList"
:key="item.field_key"
:prop="item.field_key"
:label="item.field_innername"
:renderType="item.field_type"
:search="item.search"
:fieldExtra="item.field_extra"
:fixed="item.fixed"
:param="item.value"
:width="item.width"
@linkTos="investorRouterTo"
@paramBack="paramBack"></vue-SearchColumn>
now the logic code works, but because multiple function calls cause multiple popover pop-ups, I don"t know how to solve this problem