[Vuejs]-Set emitted value in compositition Api vue 3 nuxt3

by

0👍

✅

Instead of selectedSize being a method, make it a ref: const selectedSize = ref(''). When the @selectedSize event listener fires, set the value of your selectedSize ref with the value of the $event argument that comes through to the event listener.

html
<SelectSize  @selectedSize="($event) => selectedSize = $event"></SelectSize>

js

<script setup>


let selectedSize= ref('')
let addToBasket=(id)=>{
  console.log(selectedSize.value)
  console.log(id)
}
</script>

0👍

You should use a ref()

const size = ref('');
const size = ref<CustomType>(); // or with types

You can set its value in selectedSize function

const selectedSize = (val) => {
    size.value = val;
}

And then you can access variable’s value anywhere inside script setup. In addToBasket function for example.

const addToBasket = (id) => {
    console.log(size.value);
    console.log(id)
}

Check Vue docs for ref()

Leave a comment