Nue event listener clears passed data variable

[logistor]

I have following component in Nue 2.0.0-beta.2 • Bun 1.3.1 Ubuntu - 24.04

<!doctype dhtml lib>

<div :is="product-card" :onclick="calculate">
  { price }
  <script>
    calculate() {
      this.price += 10
    }
  </script>
</div>

I pass the price from parent:

<!doctype dhtml>

<div>
  <product-card :price />
  <script>
    mounted() {
      const prices = await fetch('/prices').then(r => r.json())
      this.price = prices.purchasePrice
      this.update()
    }
  </script>
</div>

When onclick is fired Nue updates the component and price changes to empty string.

If I pass the variable from parent like:

<script>
this.price = 20
</script>

It works fine.

[logistor]

A working solution for this kind of parent / child relation is not to use update in parent but mount the child component manually.

Parent

async mounted() {
  const prices = await fetch('/prices').then(r => r.json())
  this.mount('product', 'article', prices)
}

Child

<div :is="product" :onclick="click">
  { price }
  <script>
    mounted(e) {
      this.price = e[0].price
      this.update()
    }
    click() {
      this.price += 10
    }
  </script>
</div>