implement the task with reactive
This commit is contained in:
parent
6d1f81d23a
commit
55d8a7d5d6
|
@ -13,13 +13,14 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { ref } from 'vue';
|
//import { ref } from 'vue';
|
||||||
|
import { reactive } from 'vue';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
setup() {
|
setup() {
|
||||||
const courseGoal = 'Something is written here';
|
const courseGoal = 'Something is written here';
|
||||||
//const showGoal = ref(false);
|
//const showGoal = ref(false);
|
||||||
const Goal = ref({
|
const Goal = reactive({
|
||||||
visibility: false
|
visibility: false
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -30,8 +31,13 @@ export default {
|
||||||
//}
|
//}
|
||||||
|
|
||||||
// ref object way
|
// ref object way
|
||||||
|
//function toggleGoal() {
|
||||||
|
// Goal.value.visibility = !Goal.value.visibility;
|
||||||
|
//}
|
||||||
|
|
||||||
|
// reactive way
|
||||||
function toggleGoal() {
|
function toggleGoal() {
|
||||||
Goal.value.visibility = !Goal.value.visibility;
|
Goal.visibility = !Goal.visibility;
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
|
|
Reference in New Issue