fix(router): checkout 2.x router fixed

docs/apis/ui/tab-bar/hideTabBar.md

@@ -10,7 +10,7 @@ sidebar_label: hideTabBar
 ## 类型
 
 ```tsx
-(option: Option) => Promise<CallbackResult>
+(option?: Option) => Promise<CallbackResult>
 ```
 
 ## 参数

docs/apis/ui/tab-bar/showTabBar.md

@@ -10,7 +10,7 @@ sidebar_label: showTabBar
 ## 类型
 
 ```tsx
-(option: Option) => Promise<CallbackResult>
+(option?: Option) => Promise<CallbackResult>
 ```
 
 ## 参数

packages/babel-plugin-transform-taroapi/src/__tests__/index-test.ts

@@ -53,7 +53,9 @@ it('should leave other apis untouched', function () {
   const taroName = defaultImport!.local.name
   const namedImports = getNamedImports(body[0].specifiers)
   expect(namedImports).toEqual(new Set())
+  // @ts-ignore
   expect(t.isMemberExpression(body[1].expression)).toBeTruthy()
+  // @ts-ignore
   expect((body[1].expression as t.MemberExpression)).toMatchObject(t.memberExpression(
     t.identifier(taroName),
     t.identifier('noop')
@@ -78,8 +80,10 @@ it('should move static apis under "Taro"', function () {
   expect(defaultImport).toBeTruthy()
 
   const taroName = defaultImport!.local.name
+  // @ts-ignore
   let memberExpression = body[1].expression
   if (t.isCallExpression(body[1])) {
+    // @ts-ignore
     memberExpression = (body[1].expression as t.CallExpression).callee
   }
   expect(memberExpression).toMatchObject(t.memberExpression(

packages/taro-components-rn/src/components/Checkbox/checkboxGroup.tsx

@@ -35,7 +35,7 @@ class _CheckboxGroup extends React.Component<CheckboxGroupProps> {
   }
 
   findAndAttachCb = (children: any): React.ReactNode => {
-    return React.Children.toArray(children).map((child) => {
+    return React.Children.toArray(children).map((child: any) => {
       if (!child.type) return child
 
       const childTypeName = child.type.name

packages/taro-components-rn/src/components/Form/index.tsx

@@ -53,7 +53,7 @@ class _Form extends React.Component<FormProps> {
   }
 
   deppDiveIntoChildren = (children: any): React.ReactNode => {
-    return React.Children.toArray(children).map((child) => {
+    return React.Children.toArray(children).map((child: any) => {
       const childTypeName = child.type && child.type.name
       if (!child.type) return child
       if (childTypeName === '_Button' && ['submit', 'reset'].indexOf(child.props.formType) >= 0) {

packages/taro-components-rn/src/components/Label/index.tsx

@@ -16,7 +16,7 @@ class _Label extends React.Component<LabelProps> {
   findValidWidget = (children: any): React.ReactNode => {
     if (this.hadFoundValidWidget) return children
 
-    return React.Children.toArray(children).map((child, index) => {
+    return React.Children.toArray(children).map((child: any, index) => {
       if (!child.type) return child
 
       const childTypeName = child.type.name

packages/taro-components-rn/src/components/Radio/radioGroup.tsx

@@ -29,7 +29,7 @@ class _RadioGroup extends React.Component<RadioGroupProps, RadioGroupState> {
   }
 
   findAndAttachCb = (children: any): React.ReactNode => {
-    return React.Children.toArray(children).map((child) => {
+    return React.Children.toArray(children).map((child: any) => {
       if (!child.type) return child
 
       const childTypeName = child.type.name

packages/taro-router/src/apis/index.ts

@@ -47,6 +47,18 @@ const addHtmlExtname = (str: string) => {
   return /\.html\b/.test(str) ? str : `${str}.html`
 }
 
+const notTabbar = (url: string) => {
+  const path = url.split('?')[0]
+  const app = Taro.getApp()
+  if (app && app.config) {
+    const config = app.config
+    if (config.tabBar && config.tabBar.list && config.tabBar.list instanceof Array) {
+      return config.tabBar.list.findIndex(e => e.pagePath === path) === -1
+    }
+  }
+  return true
+}
+
 const getTargetUrl = (url: string, customRoutes: CustomRoutes) => {
   const matched = url.match(/([\s\S]*)(\?[\s\S]*)?/) || []
   const pathname = matched[1] || ''
@@ -72,6 +84,8 @@ const createNavigateTo = (
 
     try {
       invariant(url, 'navigateTo must be called with a url')
+      invariant(notTabbar(url), 'can not navigateTo a tabbar page')
+
       if (/^(https?:)\/\//.test(url)) {
         window.location.assign(url)
       } else if (history) {
@@ -132,6 +146,7 @@ const createRedirectTo = (
 
     try {
       invariant(url, 'redirectTo must be called with a url')
+      // invariant(notTabbar(url), 'can not redirectTo a tabbar page')
 
       if (/^(https?:)\/\//.test(url)) {
         window.location.assign(url)

packages/taro-router/src/router/route.tsx

@@ -40,12 +40,19 @@ class Route extends Taro.Component<RouteProps, {}> {
   isRoute = true;
   scrollPos = 0;
 
+  state = {
+    location: {}
+  }
+
   constructor (props, context) {
     super(props, context)
     this.matched = this.computeMatch(this.props.currentLocation)
+    if (this.matched) {
+      this.state = { location: this.props.currentLocation }
+    }
   }
 
-  computeMatch (currentLocation) {
+  computeMatch (currentLocation: Location) {
     const path = currentLocation.path;
     const key = currentLocation.state.key;
     const isIndex = this.props.isIndex;
@@ -68,12 +75,22 @@ class Route extends Taro.Component<RouteProps, {}> {
 
   getRef = ref => {
     if (ref) {
+      if (ref.props.location !== this.state.location) {
+        ref.props.location = this.state.location
+      }
       this.componentRef = ref
-      this.props.collectComponent(ref, this.props.k)
+      this.props.collectComponent(ref, this.props.key)
     }
   }
 
   updateComponent (props = this.props) {
+    if (this.matched && this.componentRef) {
+      this.setState({
+        location: props.currentLocation
+      }, () => {
+        this.componentRef.props.location = this.state.location
+      })
+    }
     props.componentLoader()
       .then(({ default: component }) => {
         if (!component) {
@@ -93,7 +110,7 @@ class Route extends Taro.Component<RouteProps, {}> {
     this.updateComponent()
   }
 
-  componentWillReceiveProps (nProps, nContext) {
+  componentWillReceiveProps (nProps: RouteProps) {
     const isRedirect = nProps.isRedirect
     const lastMatched = this.matched
     const nextMatched = this.computeMatch(nProps.currentLocation)
@@ -150,12 +167,13 @@ class Route extends Taro.Component<RouteProps, {}> {
     if (!this.wrappedComponent) return null
 
     const WrappedComponent = this.wrappedComponent
+
     return (
       <div
         className="taro_page"
         ref={this.getWrapRef}
         style={{ minHeight: '100%' }}>
-        <WrappedComponent ref={this.getRef} />
+        <WrappedComponent ref={this.getRef} location={this.state.location} />
       </div>
     )
   }

packages/taro-router/src/router/router.tsx

@@ -126,19 +126,27 @@ class Router extends Taro.Component<Props, State> {
     const routeStack: Types.RouteObj[] = [...this.state.routeStack]
     const matchedRoute = this.computeMatch(toLocation)
     const index = routeStack.findIndex(e => e.path === toLocation.path)
-    if (index === -1) {
+    if (!this.isTabBar(routeStack[routeStack.length - 1].path)) {
+      routeStack.splice(-1, 1, assign({}, matchedRoute, {
+        key: toLocation.state.key,
+        isRedirect: true,
+        isTabBar
+      }))
+    } else if (index === -1) {
       routeStack.forEach(v => { v.isRedirect = false })
       routeStack.push(assign({}, matchedRoute, {
         key: toLocation.state.key,
         isRedirect: false,
         isTabBar
       }))
+    } else {
+      toLocation.state.key = routeStack[index].key || ''
     }
     this.setState({ routeStack, location: toLocation })
   }
 
-  collectComponent = (comp, k) => {
-    this.currentPages[k] = comp
+  collectComponent = (comp, index: string) => {
+    this.currentPages[Number(index) || 0] = comp
   }
 
   componentDidMount () {
@@ -152,14 +160,16 @@ class Router extends Taro.Component<Props, State> {
       toLocation,
       action
     }) => {
-      if (action === "PUSH") {
-        this.push(toLocation);
-      } else if (action === "POP") {
+      if (action === "POP") {
         this.pop(toLocation, fromLocation);
       } else if (this.isTabBar(toLocation.path)) {
         this.switch(toLocation, true);
       } else {
-        this.replace(toLocation);
+        if (action === "PUSH") {
+          this.push(toLocation);
+        } else {
+          this.replace(toLocation);
+        }
       }
 
       this.lastLocation = history.location
@@ -175,7 +185,15 @@ class Router extends Taro.Component<Props, State> {
   }
 
   componentWillUpdate (nextProps, nextState) {
-    this.currentPages.length = nextState.routeStack.length
+    if (Taro._$router) {
+      this.currentPages.length = Number(Taro._$router.state.key) + 1
+    }
+  }
+
+  componentDidShow () {
+    if (Taro._$router) {
+      this.currentPages.length = Number(Taro._$router.state.key) + 1
+    }
   }
 
   componentWillUnmount () {

packages/taro-transformer-wx/src/class.ts

@@ -962,6 +962,7 @@ class Transformer {
           ))
         ]))
       this.classPath.node.body.body = this.classPath.node.body.body.concat(method)
+    // @ts-ignore
     } else if (t.isMemberExpression(expr) && !t.isThisExpression(expr.object)) {
       // @TODO: 新旧 props 系统在事件处理上耦合太深，快应用应用新 props 把旧 props 系统逻辑全部清楚
       this.buildAnonyMousFunc(path, attr, expr)

packages/taro-transformer-wx/src/jsx.ts

@@ -211,6 +211,7 @@ export function parseJSXElement (element: t.JSXElement, isFirstEmit = false): st
     attributesTrans = attributes.reduce((obj, attr) => {
       if (t.isJSXSpreadAttribute(attr)) {
         if (isNewPropsSystem()) return {}
+        // @ts-ignore
         throw codeFrameError(attr.loc, 'JSX 参数暂不支持 ...spread 表达式')
       }
       let name = attr.name.name

packages/taro-transformer-wx/src/render.ts

@@ -991,6 +991,7 @@ export class RenderParser {
     const properties: Array<t.ObjectProperty | t.SpreadProperty> = []
     openingElement.attributes = attrs.filter(attr => {
       if (t.isJSXSpreadAttribute(attr)) {
+        // @ts-ignore
         properties.push(t.spreadProperty(attr.argument))
         return false
       } else if (t.isJSXAttribute(attr)) {
@@ -1511,12 +1512,15 @@ export class RenderParser {
           const { properties } = id.node
           for (const p of properties) {
             if (t.isIdentifier(p)) {
+              // @ts-ignore
               if (this.initState.has(p.name)) {
                 // tslint:disable-next-line
                 console.log(codeFrameError(id.node, errMsg).message)
               }
             }
+            // @ts-ignore
             if (t.isSpreadProperty(p) && t.isIdentifier(p.argument)) {
+              // @ts-ignore
               if (this.initState.has(p.argument.name)) {
                 // tslint:disable-next-line
                 console.log(codeFrameError(id.node, errMsg).message)

packages/taro/types/api/ui/tab-bar.d.ts

@@ -35,7 +35,7 @@ declare namespace Taro {
    * @supported weapp, h5
    * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/tab-bar/wx.showTabBar.html
    */
-  function showTabBar(option: showTabBar.Option): Promise<General.CallbackResult>
+  function showTabBar(option?: showTabBar.Option): Promise<General.CallbackResult>
 
   namespace setTabBarStyle {
     interface Option {
@@ -55,7 +55,7 @@ declare namespace Taro {
       success?: (res: General.CallbackResult) => void
     }
   }
-  
+
   /** 动态设置 tabBar 的整体样式
    * @supported weapp, h5
    * @example
@@ -188,5 +188,5 @@ declare namespace Taro {
    * @supported weapp, h5
    * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/tab-bar/wx.hideTabBar.html
    */
-  function hideTabBar(option: hideTabBar.Option): Promise<General.CallbackResult>
+  function hideTabBar(option?: hideTabBar.Option): Promise<General.CallbackResult>
 }