fix: connect do not update issue, close #202

pull/225/head
tangjinzhou 2018-09-29 15:07:37 +08:00
parent f597b7ece3
commit 213706c185
2 changed files with 20 additions and 8 deletions

View File

@ -9,7 +9,7 @@ export default function wrapWithConnect (WrappedComponent) {
const tempProps = WrappedComponent.props || {}
const methods = WrappedComponent.methods || {}
const props = {}
Object.keys(tempProps).forEach(k => { props[k] = PropTypes.any })
Object.keys(tempProps).forEach(k => { props[k] = ({ ...k, required: false }) })
WrappedComponent.props.__propsSymbol__ = PropTypes.any
WrappedComponent.props.children = PropTypes.array.def([])
const ProxyWrappedComponent = {
@ -22,19 +22,24 @@ export default function wrapWithConnect (WrappedComponent) {
},
},
render () {
const { $listeners, $slots = {}, $attrs } = this
const { $listeners, $slots = {}, $attrs, $scopedSlots } = this
const props = getOptionProps(this)
const wrapProps = {
props: {
...props,
__propsSymbol__: Symbol(),
children: $slots.default || [],
children: $slots.default || props.children || [],
},
on: $listeners,
attrs: $attrs,
scopedSlots: $scopedSlots,
}
return (
<WrappedComponent {...wrapProps} ref='wrappedInstance'/>
<WrappedComponent {...wrapProps} ref='wrappedInstance'>
{Object.keys($slots).map(name => {
return <template slot={name}>{$slots[name]}</template>
})}
</WrappedComponent>
)
},
}

View File

@ -2,6 +2,7 @@ import shallowEqual from 'shallowequal'
import omit from 'omit.js'
import { getOptionProps } from '../props-util'
import PropTypes from '../vue-types'
import proxyComponent from '../proxyComponent'
function getDisplayName (WrappedComponent) {
return WrappedComponent.name || 'Component'
@ -13,8 +14,10 @@ export default function connect (mapStateToProps) {
const finnalMapStateToProps = mapStateToProps || defaultMapStateToProps
return function wrapWithConnect (WrappedComponent) {
const tempProps = omit(WrappedComponent.props || {}, ['store'])
const props = {}
Object.keys(tempProps).forEach(k => { props[k] = PropTypes.any })
const props = {
__propsSymbol__: PropTypes.any,
}
Object.keys(tempProps).forEach(k => { props[k] = ({ ...k, required: false }) })
const Connect = {
name: `Connect_${getDisplayName(WrappedComponent)}`,
props,
@ -28,7 +31,11 @@ export default function connect (mapStateToProps) {
}
},
watch: {
__propsSymbol__ () {
if (mapStateToProps && mapStateToProps.length === 2) {
this.subscribed = finnalMapStateToProps(this.store.getState(), this.$props)
}
},
},
mounted () {
this.trySubscribe()
@ -88,6 +95,6 @@ export default function connect (mapStateToProps) {
)
},
}
return Connect
return proxyComponent(Connect)
}
}