Merge pull request #1462 from didi/feat-react-wxkey

feat: wx:key

packages/core/src/platform/builtInMixins/directiveHelperMixin.android.js

@@ -0,0 +1,2 @@
+import directiveHelperMixin from './directiveHelperMixin.ios'
+export default directiveHelperMixin

packages/core/src/platform/builtInMixins/directiveHelperMixin.ios.js

@@ -0,0 +1,15 @@
+import { warn, type } from '@mpxjs/utils'
+export default function directiveHelperMixin () {
+  return {
+    methods: {
+      __getWxKey (item, key) {
+        const value = key === '*this' ? item : item[key]
+        if (typeof value === 'string' || typeof value === 'number') {
+          return value
+        } else {
+          warn(`wx:key's value should return a string or a number, received: ${type(value)}`, this.__mpxProxy.options.mpxFileResource)
+        }
+      }
+    }
+  }
+}

packages/core/src/platform/builtInMixins/index.js

@@ -11,13 +11,15 @@ import componentGenericsMixin from './componentGenericsMixin'
 import getTabBarMixin from './getTabBarMixin'
 import pageRouteMixin from './pageRouteMixin'
 import styleHelperMixin from './styleHelperMixin'
+import directiveHelperMixin from './directiveHelperMixin'
 import { isReact } from '@mpxjs/utils'
 
 export default function getBuiltInMixins (options, type) {
   let bulitInMixins
   if (isReact) {
     bulitInMixins = [
       proxyEventMixin(),
+      directiveHelperMixin(),
       styleHelperMixin()
     ]
   } else if (__mpx_mode__ === 'web') {

packages/webpack-plugin/lib/template-compiler/compiler.js

@@ -1751,6 +1751,13 @@ function postProcessFor (el) {
 
 function postProcessForReact (el) {
   if (el.for) {
+    if (el.for.key) {
+      addExp(el, `this.__getWxKey(${el.for.item}, '${el.for.key}')`, false, 'key')
+      addAttrs(el, [{
+        name: 'key',
+        value: el.for.key
+      }])
+    }
     popForScopes()
   }
 }