方法一:nuxt.config.js配置head
head: {
meta: [
{ charset: 'utf-8' },
{ name: 'format-detection', content: 'telephone=no' },
{ name: 'viewport', content: 'width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=0' }
],
}
核心代码 maximum-scale=1.0,user-scalable=0
user-scalable标识是否允许对页面进行缩放,取值有两个yes和no。设置为no则不允许进行页面缩放了。
此种方法在大多数移动端有效,但在safari失效,如果是nuxt项目新建一个plugins文件
方法二:nuxt项目新建一个plugins文件
// disable-scale.js
if (process.browser) {
window.onNuxtReady(app => {
// 禁止双击缩放
document.documentElement.addEventListener(
'touchstart',
function(event) {
if (event.touches.length > 1) {
event.preventDefault()
}
},
false
)
// 禁止双指缩放
var lastTouchEnd = 0
document.documentElement.addEventListener(
'touchend',
function(event) {
var now = Date.now()
if (now - lastTouchEnd <= 300) {
event.preventDefault()
}
lastTouchEnd = now
},
false
)
})
}
在config文件里面plusgins下面加上
{ src: '~plugins/disable-scale', ssr: false },
就ok辣