popper的幾種用法

1、簡介：在優化乙個頁面時發現popper太多太亂，有好幾種使用方法，就想著歸納總結一下

2、方式

2-1、直接使用，觸發的dom是直接包在裡面的，適用於單個少量元素，比如說乙個頁面就乙個按鈕需要彈出來

popover

placement="bottom"title="標題"width="200"trigger="click"content="這是一段內容,這是一段內容,這是一段內容,這是一段內容。">
click 啟用
2-2、跟**配合使用且固定大小的popover，只用寫乙個popover，優化效能
給**加上
@cell-click="呼叫方法"
方法裡寫

function

(row, column, cell)
this.$nexttick(() =>)})}
}}
html

<

el-popover
v-if
="curnumcellt"
ref="netweight"
:reference
="curnumcellt"
placement
="right"
width
="250"
trigger
="click"
>
<
div 
v-if
="columntype == 'piecenum'"
>
<
div 
class
="el-form-item el-form-item--mini"
style
="margin-bottom: 10px"
>
<
label 
class
="el-form-item__label"
>}
label
>
<
div 
class
="el-form-item__content"
>
<
el-input
size
="mini"
v-model
="editnetweightform.piecenum"
@keydown.enter.native
="confirmchangenum"
>
el-input
>
div>
div>
<
div 
style
="text-align: right; margin: 0"
>
<
el-button 
size
="mini"
type
="text"
@click
="closenumpopover"
>}
el-button
>
<
el-button 
type
="primary"
size
="mini"
@click
="confirmchangenum"
>
} 
el-button
>
div>
div>
el-popover
>
效果

2-3、在第二種方法的基礎上做些更改，第二種方法如果popover裡面是不固定大小的會導致錯位，更改後的方法跟**配合使用且大小可以不用固定，適用列表等
在**內嵌的template直接呼叫方法
column

class-name="align-right":label="$t('addsaleorder.netweightsale')"prop="netweightsale"align="center"
>
style="color: #409eff; cursor: pointer"@click="getunfinishedsaleorderpage(scope.row, ...arguments)"
>}
getunfinishedsaleorderpage的方法
getunfinishedsaleorderpage(row, dom) 

this.$nexttick(() =>)
})}) },
html

<

el-popover
v-if
="netweightsalecellt"
:reference
="netweightsalecellt"
trigger
="click"
placement
="top"
ref="netweightsale"
>
<
el-table 
:data
="tabledatanetweightsale"
size
="mini"
style
="width: 610px"
min-height
="400"
>
<
el-table-column
prop
="customername"
:label
="$t('customerprice.customername')"
width
="200"
show-overflow-tooltip
>
el-table-column
>
<
el-table-column 
prop
="netweight"
:label
="$t('saleinfo.reservenum')"
width
="200"
show-overflow-tooltip
>
<
template 
slot-scope
="props"
>
} 
template
>
el-table-column
>
<
el-table-column 
prop
="ordertime"
:label
="$t('picklist.lastesttime')"
width
="200"
show-overflow-tooltip
>
<
template 
v-slot
="">
} 
template
>
el-table-column
>
el-table
>
el-popover
>
效果
 
Intent的幾種用法
returnit new intent intent.action delete,uninstalluri install apk uri installuri uri.fromparts package null returnit new intent intent.action package ...
php curl的幾種用法
1.php curl的預設呼叫方法，get方式訪問url curl setopt ch,curlopt httpheader,header 設定http頭 curl setopt ch,curlopt url,url curl setopt ch,curlopt useragent,user age...
Intent的幾種用法
intent 應該算是android中特有的東西。你可以在intent中指定程式 要執行的動作 比如 view,edit,dial 以及程式執行到該動作時所需要的資料。都指定好後，只要呼叫startactivity android系統會自動尋找最符合你指定要求的應用 程式，並執行該程式。下面列出幾種...