Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can I realize `v-model` in the render function?

Tags:

vue.js

When I read the Data of render-function: https://v2.vuejs.org/v2/guide/render-function.html#The-Data-Object-In-Depth

There is no v-model place, the v-model is not exist in Vue.js 2.0.

This bellow is the official website given data example, but it do not says the v-model placement:

{
  // Same API as `v-bind:class`
  class: {
    foo: true,
    bar: false
  },
  // Same API as `v-bind:style`
  style: {
    color: 'red',
    fontSize: '14px'
  },
  // Normal HTML attributes
  attrs: {
    id: 'foo'
  },
  // Component props
  props: {
    myProp: 'bar'
  },
  // DOM properties
  domProps: {
    innerHTML: 'baz'
  },
  // Event handlers are nested under `on`, though
  // modifiers such as in `v-on:keyup.enter` are not
  // supported. You'll have to manually check the
  // keyCode in the handler instead.
  on: {
    click: this.clickHandler
  },
  // For components only. Allows you to listen to
  // native events, rather than events emitted from
  // the component using `vm.$emit`.
  nativeOn: {
    click: this.nativeClickHandler
  },
  // Custom directives. Note that the `binding`'s
  // `oldValue` cannot be set, as Vue keeps track
  // of it for you.
  directives: [
    {
      name: 'my-custom-directive',
      value: '2',
      expression: '1 + 1',
      arg: 'foo',
      modifiers: {
        bar: true
      }
    }
  ],
  // Scoped slots in the form of
  // { name: props => VNode | Array<VNode> }
  scopedSlots: {
    default: props => createElement('span', props.text)
  },
  // The name of the slot, if this component is the
  // child of another component
  slot: 'name-of-slot',
  // Other special top-level properties
  key: 'myKey',
  ref: 'myRef'
}

You see there are many key, such as like the ref, key, props and so on, How can I realize the requirement?

like image 993
sof-03 Avatar asked Feb 01 '26 23:02

sof-03


1 Answers

props: {
    myProp: 'bar',
    value: 'someValue'
  },
  on: {
    click: this.clickHandler,
    input: function(value) {
        // change someValue here using value
    },

  },
like image 99
Georgi Antonov Avatar answered Feb 03 '26 23:02

Georgi Antonov



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!