Skip to content
Snippets Groups Projects

Resolve "Implement basic functionality"

Merged Julian requested to merge 1-implement-basic-functionality into main
2 files
+ 93
10
Compare changes
  • Side-by-side
  • Inline
Files
2
+ 48
0
 
<template>
 
<div>
 
<p>External counter:</p>
 
<div class="row">
 
<button @click="$emit('input', value - 1)">-</button>
 
{{ value }}
 
<button @click="$emit('input', value + 1)">+</button>
 
</div>
 
 
<p>Internal counter:</p>
 
<div class="row">
 
<button @click="count--">-</button>
 
{{ count }}
 
<button @click="count++">+</button>
 
</div>
 
</div>
 
</template>
 
 
<script>
 
export default {
 
name: "NumberCounter",
 
props: {
 
value: Number,
 
},
 
emits: ["input"],
 
data() {
 
return {
 
count: 0,
 
};
 
},
 
};
 
</script>
 
 
<style scoped>
 
div {
 
background: #2c3e50;
 
color: white;
 
display: flex;
 
flex-direction: column;
 
align-items: center;
 
padding: 1em;
 
gap: 3px;
 
}
 
div.row {
 
flex-direction: row;
 
gap: 1em;
 
}
 
</style>
Loading