我在express中运行vue.js,所有操作都按预期进行,用于点击事件。。。它什么都不做,当我点击任何一个按钮时,都不会启动
HTML:
<div v-on:click="function2">
<button type="button" class="btn btn-primary" @click.native="testFunction">Function 1</button>
<button type="button" class="btn btn-primary" v-on:click="function2">Function 2</button>
</div>
服务器
app.get('*', async(req, res) => {
const app2 = createSSRApp({
data (){
return {
url: req.url,
message : 'ok',
ok : true,
image : '...'
}
},
methods : {
testFunction(event){
this.$emit('click', this.page, event);
},
function2(){
console.log('9')
}
},
template : require('fs').readFileSync('./html/pages/home.html', 'utf-8')
})
const content = await renderToString(app2)
const html = `
<!DOCTYPE html><script>
console.log('ooo')
</script>
<html lang="en">
<head><title>Hello</title></head>
<body>${content}</body>
</html>
`
res.end(html)
})
我正在使用express和ssr。
我甚至在标题中放了一些内联javascript来检查,在标题中,它可以工作,但在点击甚至中却不行
您在中使用@click
<button type="button" class="btn btn-primary" @click.native="testFunction">Function 1</button>
在中也使用v-on:click
<button type="button" class="btn btn-primary" v-on:click="function2">Function 2</button>
因此@click="addTwo"
与v-on:click="addTwo"
相同
Vue.js风格指南建议不要在项目中混合使用它们。使用@
或v-on
,但不能同时使用。