Reactive values are not updated? why?

[yuhengliang]

<div @name="test">
    <p>Countdown: { countdown }</p>
    <script>
        countdown = 0
        mounted() {
            setInterval(() => {
                this.countdown++
                console.log(this.countdown)
            }, 1000)
        }
    </script>
</div>

The ' countdown ' not updated, why ? How do update automatically?

[yuhengliang]

can use ' this.update() ' , Are there other ways to update automatically?

[yuhengliang]

<div @name="test">
    <layout>
        <p>Countdown: { countdown }</p>
    </layout>
    <script>
        countdown = 0
        mounted() {
            setInterval(() => {
                this.countdown++
                console.log(this.countdown)
                this.update()
            }, 1000)
        }
    </script>
</div>

layout is custom component ,

<div @name="layout">
    <slot />
</div>

use this.update(), but, The ' countdown ' not updated to, why ? How do update automatically?

[fritx]

I have similar problem with :if:

<label :if="condition"><select @change="render"></select></label>
<script>
render() {
  this.update({ foo: 'bar' })
  // won't work, because inside the `createApp` for `:if`
 // the `Impl` is undefined but not the parent view

  this.foo = 'bar' // works
}
</script>