diff --git a/docs/best-practice.md b/docs/best-practice.md
index 6e35c7700000..9983df5b9ae9 100644
--- a/docs/best-practice.md
+++ b/docs/best-practice.md
@@ -214,6 +214,10 @@ if (process.env.NODE_ENV === 'development') {
 }
 ```
 
+### 使用 `this.$componentType` 来判断当前 Taro.Component 是页面还是组件
+
+`this.$componentType` 可能取值分别为 `PAGE` 和 `COMPONENT`，开发者可以根据此变量的取值分别采取不同逻辑。
+
 ### 预加载
 
 在**微信小程序中**，从调用 `Taro.navigateTo`、`Taro.redirectTo` 或 `Taro.switchTab` 后，到页面触发 componentWillMount 会有一定延时。因此一些网络请求可以提前到发起跳转前一刻去请求。
diff --git a/packages/taro-alipay/src/component.js b/packages/taro-alipay/src/component.js
index 1a101e8ff8ee..a51aabc42c41 100644
--- a/packages/taro-alipay/src/component.js
+++ b/packages/taro-alipay/src/component.js
@@ -20,13 +20,15 @@ class BaseComponent {
   _disable = true
   _pendingStates = []
   _pendingCallbacks = []
+  $componentType = ''
   $router = {
     params: {}
   }
 
-  constructor () {
+  constructor (props = {}, isPage) {
     this.state = {}
     this.props = {}
+    this.$componentType = isPage ? 'PAGE' : 'COMPONENT'
   }
   _constructor (props) {
     this.props = props || {}
diff --git a/packages/taro-alipay/src/create-component.js b/packages/taro-alipay/src/create-component.js
index 5fd317c8396e..bf7e4c76420d 100644
--- a/packages/taro-alipay/src/create-component.js
+++ b/packages/taro-alipay/src/create-component.js
@@ -280,7 +280,7 @@ function createComponent (ComponentClass, isPage) {
     Object.assign(weappComponentConf, {
       onLoad (options = {}) {
         hasPageInited = false
-        this.$component = new ComponentClass()
+        this.$component = new ComponentClass({}, isPage)
         this.$component._init(this)
         this.$component.render = this.$component._createData
         this.$component.__propTypes = ComponentClass.propTypes
@@ -313,7 +313,7 @@ function createComponent (ComponentClass, isPage) {
   } else {
     Object.assign(weappComponentConf, {
       didMount () {
-        this.$component = new ComponentClass()
+        this.$component = new ComponentClass({}, isPage)
         this.$component._init(this)
         this.$component.render = this.$component._createData
         this.$component.__propTypes = ComponentClass.propTypes
diff --git a/packages/taro-swan/src/component.js b/packages/taro-swan/src/component.js
index ab349c93bc8f..4e4e1f529f68 100644
--- a/packages/taro-swan/src/component.js
+++ b/packages/taro-swan/src/component.js
@@ -22,13 +22,15 @@ class BaseComponent {
   _disable = true
   _pendingStates = []
   _pendingCallbacks = []
+  $componentType = ''
   $router = {
     params: {}
   }
 
-  constructor () {
+  constructor (props = {}, isPage) {
     this.state = {}
     this.props = {}
+    this.$componentType = isPage ? 'PAGE' : 'COMPONENT'
   }
   _constructor (props) {
     this.props = props || {}
diff --git a/packages/taro-swan/src/create-component.js b/packages/taro-swan/src/create-component.js
index d01f5dc776f6..889766e9db43 100644
--- a/packages/taro-swan/src/create-component.js
+++ b/packages/taro-swan/src/create-component.js
@@ -245,7 +245,7 @@ function createComponent (ComponentClass, isPage) {
     data: initData,
     created (options = {}) {
       isPage && (hasPageInited = false)
-      this.$component = new ComponentClass()
+      this.$component = new ComponentClass({}, isPage)
       this.$component._init(this)
       this.$component.render = this.$component._createData
       this.$component.__propTypes = ComponentClass.propTypes
diff --git a/packages/taro-weapp/src/component.js b/packages/taro-weapp/src/component.js
index 6c274731bad4..120d70701431 100644
--- a/packages/taro-weapp/src/component.js
+++ b/packages/taro-weapp/src/component.js
@@ -24,13 +24,15 @@ class BaseComponent {
   _isForceUpdate = false
   _pendingStates = []
   _pendingCallbacks = []
+  $componentType = ''
   $router = {
     params: {}
   }
 
-  constructor (props = {}) {
+  constructor (props = {}, isPage) {
     this.state = {}
     this.props = props
+    this.$componentType = isPage ? 'PAGE' : 'COMPONENT'
   }
   _constructor (props) {
     this.props = props || {}
diff --git a/packages/taro-weapp/src/create-component.js b/packages/taro-weapp/src/create-component.js
index aab64b46c371..8204e5b6de08 100644
--- a/packages/taro-weapp/src/create-component.js
+++ b/packages/taro-weapp/src/create-component.js
@@ -310,7 +310,7 @@ function createComponent (ComponentClass, isPage) {
       if (isPage && cacheDataHas(preloadInitedComponent)) {
         this.$component = cacheDataGet(preloadInitedComponent, true)
       } else {
-        this.$component = new ComponentClass()
+        this.$component = new ComponentClass({}, isPage)
       }
       this.$component._init(this)
       this.$component.render = this.$component._createData
diff --git a/packages/taro/types/index.d.ts b/packages/taro/types/index.d.ts
index e4815d5582c8..206e0118a727 100644
--- a/packages/taro/types/index.d.ts
+++ b/packages/taro/types/index.d.ts
@@ -349,6 +349,8 @@ declare namespace Taro {
 
     options?: ComponentOptions;
 
+    $componentType: 'PAGE' | 'COMPONENT'
+
     $router: {
       params: any
     }