mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-23 06:05:11 +00:00
Fix vue-class-component example
This commit is contained in:
parent
2eecb8c0de
commit
0bea10b857
@ -1,7 +1,7 @@
|
||||
module.exports = {
|
||||
build: {
|
||||
babel: {
|
||||
plugins: ['transform-decorators-legacy']
|
||||
plugins: ['transform-decorators-legacy', 'transform-class-properties']
|
||||
},
|
||||
extend (config) {
|
||||
config.resolve.alias['nuxt-class-component'] = '~plugins/nuxt-class-component'
|
||||
|
@ -1,6 +1,7 @@
|
||||
{
|
||||
"name": "nuxt-class-component",
|
||||
"dependencies": {
|
||||
"babel-plugin-transform-class-properties": "^6.24.1",
|
||||
"babel-plugin-transform-decorators-legacy": "^1.3.4",
|
||||
"nuxt": "latest",
|
||||
"vue-class-component": "^5.0.1"
|
||||
|
@ -1,13 +1,11 @@
|
||||
<template>
|
||||
<div>
|
||||
<input v-model="msg">
|
||||
<p>prop: {{propMessage}}</p>
|
||||
<p>msg: {{msg}}</p>
|
||||
<p>env: {{env}}</p>
|
||||
<p>helloMsg: {{helloMsg}}</p>
|
||||
<p>computed msg: {{computedMsg}}</p>
|
||||
<button @click="greet">Greet</button>
|
||||
<nuxt-link to="/about">About page</nuxt-link>
|
||||
<p><nuxt-link to="/about">About page</nuxt-link></p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -15,18 +13,12 @@
|
||||
import Vue from 'vue'
|
||||
import Component from 'nuxt-class-component'
|
||||
|
||||
@Component({
|
||||
props: {
|
||||
propMessage: String
|
||||
}
|
||||
})
|
||||
@Component()
|
||||
|
||||
export default class App extends Vue {
|
||||
// initial data
|
||||
msg = 123
|
||||
|
||||
// use prop values for initial data
|
||||
helloMsg = 'Hello, ' + this.propMessage
|
||||
|
||||
asyncData ({ req }) {
|
||||
return { env: req ? 'server' : 'client' }
|
||||
}
|
||||
@ -43,7 +35,7 @@ export default class App extends Vue {
|
||||
|
||||
// method
|
||||
greet () {
|
||||
alert('greeting: ' + this.msg)
|
||||
console.log('greeting: ' + this.msg)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
Loading…
Reference in New Issue
Block a user