我來自一個角度的心態,現在我想學習vue.js.我正在使用webpack,並且我有以下三個.vue
類。 CounterDisplay.vue
,IncrementButton.vue , and
App.vue . I want to increment the
count variable but all it does is
console.log how many times I pressed the button. I am trying to figure out how child to parent and parent to child work in vue. Then I need to figure out the correct pattern to use vue in a very large application. In angular you have a
module and in there you put your components and services etc. How does
vue` do this?談論組件兒童父母和孩子的父母vue.js
CounterDisplay.vue
<template>
<div id="#counterDisplay">
{{count}}
</div>
</template>
<script>
export default {
data() {
return {
count: 0
}
}
}
</script>
<style scoped>
</style>
IncrementButton.vue
<template>
<button @click.prevent="active">+1</button>
</template>
<script>
export default {
methods: {
active() {
console.log('+1 Pressed')
}
}
}
</script>
<style scoped></style>
App.vue
<template>
<div id="app">
<h3>Increment:</h3>
<increment></increment>
<h3>Counter:</h3>
<counter></counter>
</div>
</template>
<script>
import Counter from './components/CounterDisplay.vue'
import Increment from './components/IncrementButton.vue'
export default {
components: {
Counter,
Increment
}
}
</script>
<style>
</style>
這是輸出:
那麼問題是什麼? – samayo
@samayo我更新了我的問題,對不起。我還增加了一個問題,我知道我不應該問一個以上的問題,但這與我的問題有關。 – Drew1208