1. Elija el icono que desee de los gráficos vectoriales de Alibaba: https://www.iconfont.cn/home/index?spm=a313x.7781069.1998910419.2
Agréguelo a su propio proyecto y descárguelo al escritorio
2. Abra el proyecto descomprimido y copie los dos archivos a la carpeta estática de su proyecto:
3. Úsalo en la página de la página
"titleNView":{
"type":"default",
"buttons":[{
"text": "\ue618",
"fontSrc": "/static/font/iconfont.ttf",
"fontSize": "22px",
"color":"#fff",
"float": "right"
},{
"text": "\ue607",
"fontSrc": "/static/font/iconfont.ttf",
"fontSize": "22px",
"color":"#fff",
"float": "left"
}]
}
1. Puntos a los que prestar atención: el valor del texto es encontrar el icono correspondiente en iconfont.css, columna: (debe agregar u delante de e para mostrar normalmente)
.iconshezhi:before {
content: "\e618"; /* 使用:\ue618 */
}
2. FontSrc importa el archivo .ttf, el tamaño, el color y la posición se pueden escribir normalmente
4. Establezca el evento de clic: agregue el siguiente código a mi página ( mismo nivel que los datos y la carga ):
export default {
data() {
return {
}
},
onNavigationBarButtonTap(e) {
if(e.float=='right'){
console.log("你点击了设置")
}else{
console.log("你点击了扫一扫")
}
},
methods: {
}
}