How to use the @vue/reactivity.ref function in @vue/reactivity

To help you get started, we’ve selected a few @vue/reactivity examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github vuejs / vue-next / packages / runtime-core / __tests__ / apiSetupContext.spec.ts View on Github external
it('context.attrs', async () => {
    const toggle = ref(true)

    const Parent = {
      render: () => h(Child, toggle.value ? { id: 'foo' } : { class: 'baz' })
    }

    const Child = {
      // explicit empty props declaration
      // puts everything received in attrs
      // disable implicit fallthrough
      inheritAttrs: false,
      props: {},
      setup(props: any, { attrs }: any) {
        return () => h('div', attrs)
      }
    }
github vuejs / vue-next / packages / runtime-core / __tests__ / apiSetupContext.spec.ts View on Github external
setup() {
        return {
          // ref should auto-unwrap
          ref: ref('foo'),
          // object exposed as-is
          object: reactive({ msg: 'bar' }),
          // primitive value exposed as-is
          value: 'baz'
        }
      },
      render() {
github vuejs / vue-next / packages / runtime-core / __tests__ / apiSetupContext.spec.ts View on Github external
it('context.slots', async () => {
    const id = ref('foo')

    const Parent = {
      render: () =>
        h(Child, null, {
          foo: () => id.value,
          bar: () => 'bar'
        })
    }

    const Child = {
      setup(props: any, { slots }: any) {
        return () => h('div', [...slots.foo(), ...slots.bar()])
      }
    }

    const root = nodeOps.createElement('div')
github vuejs / vue-next / packages / runtime-core / __tests__ / apiSetupContext.spec.ts View on Github external
it('props', async () => {
    const count = ref(0)
    let dummy

    const Parent = {
      render: () => h(Child, { count: count.value })
    }

    const Child = defineComponent({
      setup(props: { count: number }) {
        watch(() => {
          dummy = props.count
        })
        return () => h('div', props.count)
      }
    })

    const root = nodeOps.createElement('div')
github vuejs / vue-next / packages / runtime-core / __tests__ / apiCreateComponent.spec.tsx View on Github external
setup(props) {
      props.a && props.a * 2
      props.b.slice()
      props.bb.slice()
      props.cc && props.cc.push('hoo')
      props.dd.push('dd')
      return {
        c: ref(1),
        d: {
          e: ref('hi')
        }
      }
    },
    render() {
github vuejs / vue-next / packages / runtime-core / __tests__ / apiCreateComponent.spec.tsx View on Github external
setup(props) {
      props.a && props.a * 2
      props.b.slice()
      props.bb.slice()
      props.cc && props.cc.push('hoo')
      props.dd.push('dd')
      return {
        c: ref(1),
        d: {
          e: ref('hi')
        }
      }
    },
    render() {