JSX Vue

JSX Vue

jsx中 sync 写法

Home.tsx

import MyComponent from './myComponent.tsx'

export default class OrganizationManagement extends Vue {

	 this.province = val,
	      
	    }
	  }}
	/>
}

使用 on 扩展监听值的变化，然后重新赋值。

myComponent.tsx

import { Component, Vue, Prop, PropSync } from 'vue-property-decorator'

@Component({})
export default class AddressSelect extends Vue {
  @PropSync('province', {}) private syncProvince!: string

  protected render(h: any) {
    return (
    	
          ...
       
    )
  }
}

回顾 .sync
sync的非语法糖写法

等同于：

Attributes/Props

render() {
  return 
}

with a dynamic binding:

render() {
  return 
}

with the spread operator (object needs to be compatible with Vue Data Object):

render() {
  const inputAttrs = {
    type: 'email',
    placeholder: 'Enter your email'
  }

  return 
}

参考

vue-jsx Github