diff --git a/packages/uni-cli-shared/components/uni-match-media.vue b/packages/uni-cli-shared/components/uni-match-media.vue
index d01803eb0dc9a96699551afe6599e7b697f087d8..b39ecfce8325287c83a1a33103d6969f9b019652 100644
--- a/packages/uni-cli-shared/components/uni-match-media.vue
+++ b/packages/uni-cli-shared/components/uni-match-media.vue
@@ -1,12 +1,11 @@
 <template>
-  <view
-    v-show="matches"
-  > 
-    <slot />
-  </view>
+ <view v-show="matches">
+	<slot />
+ </view>
 </template>
 
 <script>
+let mediaQueryObserver
 export default {
   name: 'UniMatchMedia',
   props: {
@@ -42,13 +41,13 @@ export default {
 
   data () {
     return {
-      matches: false
+      matches: true,
     }
   },
 
   mounted() {
-    const mediaQ = uni.createMediaQueryObserver()
-    mediaQ.observe({
+    mediaQueryObserver = uni.createMediaQueryObserver(this)
+    mediaQueryObserver.observe({
         width: this.width,
         maxWidth: this.maxWidth,
         minWidth: this.minWidth,
@@ -61,15 +60,14 @@ export default {
       })
   },
 
+  destroyed() {
+    mediaQueryObserver.disconnect()
+  }
 }
 </script>
 
 <style>
-  view {
-    display: block;
-  }
-
-  view[hidden] {
-    display: none;
-  }
+	view {
+		display: block;
+	}
 </style>
diff --git a/packages/uni-cli-shared/lib/tags.js b/packages/uni-cli-shared/lib/tags.js
index e5207de2441a78a622e28fdaaa1554cb1018d328..831c307acf3b2fcca00d16cdd2f1be549ce8d20c 100644
--- a/packages/uni-cli-shared/lib/tags.js
+++ b/packages/uni-cli-shared/lib/tags.js
@@ -41,5 +41,4 @@ module.exports = {
   video: ['app-plus', 'mp-weixin', 'h5'],
   view: ['app-plus', 'mp-weixin', 'h5'],
   'web-view': ['app-plus', 'mp-weixin'],
-  'match-media': ['app-plus', 'mp-weixin', 'h5']
 }
diff --git a/packages/uni-migration/lib/mp-weixin/transform/template-transformer/transform/traverse.js b/packages/uni-migration/lib/mp-weixin/transform/template-transformer/transform/traverse.js
index 90e1f5313c7e82285610ea89fc8d87115e6f3adc..886e1b765aa745a05825ade71186a22bc3d29122 100644
--- a/packages/uni-migration/lib/mp-weixin/transform/template-transformer/transform/traverse.js
+++ b/packages/uni-migration/lib/mp-weixin/transform/template-transformer/transform/traverse.js
@@ -45,7 +45,6 @@ const TAGS = [
   'video',
   'view',
   'web-view',
-  'match-media'
 ]
 
 const EVENTS = {
diff --git a/packages/uni-template-compiler/lib/mp.js b/packages/uni-template-compiler/lib/mp.js
index da2a6d3fc6abbe3cbdd97a169cf27bae204a9408..dba95d6e7963a8a548b29d016aedd4e7ab32234d 100644
--- a/packages/uni-template-compiler/lib/mp.js
+++ b/packages/uni-template-compiler/lib/mp.js
@@ -48,7 +48,6 @@ const tags = [
   'view',
   'web-view',
   'editor',
-  'match-media'
 ]
 
 const baseCompiler = {
diff --git a/packages/vue-cli-plugin-uni/packages/postcss/index.js b/packages/vue-cli-plugin-uni/packages/postcss/index.js
index 7f2d7ec49955ba4f324bfe99d1e5be755918708c..783e9c2c00f1630d17cad440156fcea7de27d331 100644
--- a/packages/vue-cli-plugin-uni/packages/postcss/index.js
+++ b/packages/vue-cli-plugin-uni/packages/postcss/index.js
@@ -136,8 +136,7 @@ if (process.env.UNI_USING_V3) {
     'textarea',
     'video',
     'view',
-    'web-view',
-    'match-media'
+    'web-view'
   ]
 
   const BG_PROPS = [
diff --git a/src/core/helpers/tags.js b/src/core/helpers/tags.js
index d90749a68cc9c5ff46057c2b525e458c056495bd..f13b0f6162e6ec3c668e3a993dc803e6923a823c 100644
--- a/src/core/helpers/tags.js
+++ b/src/core/helpers/tags.js
@@ -2,7 +2,7 @@ module.exports = [
   'uni-app',
   'uni-layout',
   'uni-content',
-  'uni-main',
+  'uni-main',
   'uni-top-window',
   'uni-left-window',
   'uni-right-window',
@@ -58,6 +58,5 @@ module.exports = [
   'uni-textarea',
   'uni-video',
   'uni-view',
-  'uni-web-view',
-  'uni-match-media'
+  'uni-web-view'
 ]
diff --git a/src/core/view/bridge/subscribe/api/request-media-query-observer.js b/src/core/view/bridge/subscribe/api/request-media-query-observer.js
index 1b0b553179fde78d4a943ee54497b33cebc22761..b93049febc092865b28683d14511af01914fa755 100644
--- a/src/core/view/bridge/subscribe/api/request-media-query-observer.js
+++ b/src/core/view/bridge/subscribe/api/request-media-query-observer.js
@@ -41,7 +41,7 @@ export function requestMediaQueryObserver ({
     throw new Error(`Not Found：Page[${pageId}]`)
   }
 
-  const pageVm = page.$vm
+  // const pageVm = page.$vm
 
   // 创建一个媒体查询对象
   const mediaQueryObserver = mediaQueryObservers[reqId] = window.matchMedia(handleMediaQueryStr(options))
@@ -51,7 +51,7 @@ export function requestMediaQueryObserver ({
     UniViewJSBridge.publishHandler('onRequestMediaQueryObserver', {
       reqId,
       res: e.matches
-    }, pageVm.$page.id)
+    }, pages[pages.length - 1].$page.id)
   }
 
   listener(mediaQueryObserver) // 监听前执行一次媒体查询
diff --git a/src/core/view/components/match-media/index.vue b/src/core/view/components/match-media/index.vue
deleted file mode 100644
index cbae378000d51f6b33aefb0fb3b7a7a4399998bc..0000000000000000000000000000000000000000
--- a/src/core/view/components/match-media/index.vue
+++ /dev/null
@@ -1,122 +0,0 @@
-<template>
-  <uni-match-media
-    v-show="MediaQueryListRes"
-    v-on="$listeners"
-  >
-    <slot />
-  </uni-match-media>
-</template>
-
-<script>
-export default {
-  name: 'MatchMedia',
-  props: {
-    width: {
-      type: [Number, String],
-      default: ''
-    },
-    minWidth: {
-      type: [Number, String],
-      default: ''
-    },
-    maxWidth: {
-      type: [Number, String],
-      default: ''
-    },
-    height: {
-      type: [Number, String],
-      default: ''
-    },
-    minHeight: {
-      type: [Number, String],
-      default: ''
-    },
-    maxHeight: {
-      type: [Number, String],
-      default: ''
-    },
-    orientation: {
-      type: String,
-      default: ''
-    }
-  },
-
-  data () {
-    return {
-      MediaQueryListRes: true,
-      mql: null
-    }
-  },
-
-  computed: {
-    handleMediaQueryStr () {
-      let mediaQueryStr = []
-      const { $props } = this
-      const propsMenu = [
-        'width',
-        'minWidth',
-        'maxWidth',
-        'height',
-        'minHeight',
-        'maxHeight',
-        'orientation'
-      ]
-      for (const item of propsMenu) {
-        if (item !== 'orientation' && $props[item] !== '' && Number($props[item]) >= 0) {
-          mediaQueryStr.push(`(${this.humpToLine(item)}: ${Number($props[item])}px)`)
-        }
-        if (item === 'orientation' && $props[item]) {
-          mediaQueryStr.push(`(${this.humpToLine(item)}: ${$props[item]})`)
-        }
-      }
-      mediaQueryStr = mediaQueryStr.join(' and ')
-      return mediaQueryStr
-    }
-  },
-
-  watch: {
-    handleMediaQueryStr: 'replaceListener'
-  },
-
-  mounted () {
-    this.mql = window.matchMedia(this.handleMediaQueryStr)
-    this.handleMediaQuery(this.mql)
-    this.mql.addListener(this.handleMediaQuery)
-  },
-
-  beforeDestroy () {
-    this.mql.removeListener(this.handleMediaQuery)
-  },
-
-  methods: {
-    handleMediaQuery (e) {
-      if (e.matches) {
-        this.MediaQueryListRes = true
-      } else {
-        this.MediaQueryListRes = false
-      }
-    },
-
-    replaceListener () {
-      this.mql.removeListener(this.handleMediaQuery)
-      this.mql = window.matchMedia(this.handleMediaQueryStr)
-      this.handleMediaQuery(this.mql)
-      this.mql.addListener(this.handleMediaQuery)
-    },
-
-    humpToLine (name) {
-      return name.replace(/([A-Z])/g, '-$1').toLowerCase()
-    }
-  }
-}
-</script>
-
-<style>
-  uni-match-media {
-    display: block;
-  }
-
-  uni-match-media[hidden] {
-  display: none;
-}
-</style>
diff --git a/src/platforms/mp-alipay/runtime/api/index.js b/src/platforms/mp-alipay/runtime/api/index.js
index bd3b756fbc02337ae11b0aa2e636b5df45a1be70..5441d05f08f8d1b009ef3d6fedd3c75ae81a5d5e 100644
--- a/src/platforms/mp-alipay/runtime/api/index.js
+++ b/src/platforms/mp-alipay/runtime/api/index.js
@@ -106,4 +106,4 @@ export function createIntersectionObserver (component, options) {
   return my.createIntersectionObserver(options)
 }
 
-export { createMediaQueryObserver }
\ No newline at end of file
+export { createMediaQueryObserver }
diff --git a/src/platforms/mp-baidu/runtime/api/index.js b/src/platforms/mp-baidu/runtime/api/index.js
index 82f98cdcb9fc228f5a187ca0f9310cf113246aea..c8421fc0a85c769b77afe4cc0ee4f53a5cfcda71 100644
--- a/src/platforms/mp-baidu/runtime/api/index.js
+++ b/src/platforms/mp-baidu/runtime/api/index.js
@@ -18,4 +18,4 @@ export function requestPayment (params) {
   }
 }
 
-export { createMediaQueryObserver }
\ No newline at end of file
+export { createMediaQueryObserver }
diff --git a/src/platforms/mp-qq/runtime/api/index.js b/src/platforms/mp-qq/runtime/api/index.js
index 141468c0e6ddf585683eca464dad1c48f9948124..30dbcf6e2a35790873ed80fe6b8e1d16788c5db1 100644
--- a/src/platforms/mp-qq/runtime/api/index.js
+++ b/src/platforms/mp-qq/runtime/api/index.js
@@ -1,3 +1,3 @@
 import createMediaQueryObserver from '../../../mp-weixin/helpers/create-media-query-observer'
 
-export { createMediaQueryObserver }
\ No newline at end of file
+export { createMediaQueryObserver }
diff --git a/src/platforms/mp-toutiao/runtime/api/index.js b/src/platforms/mp-toutiao/runtime/api/index.js
index 141468c0e6ddf585683eca464dad1c48f9948124..30dbcf6e2a35790873ed80fe6b8e1d16788c5db1 100644
--- a/src/platforms/mp-toutiao/runtime/api/index.js
+++ b/src/platforms/mp-toutiao/runtime/api/index.js
@@ -1,3 +1,3 @@
 import createMediaQueryObserver from '../../../mp-weixin/helpers/create-media-query-observer'
 
-export { createMediaQueryObserver }
\ No newline at end of file
+export { createMediaQueryObserver }
diff --git a/src/platforms/mp-weixin/helpers/create-media-query-observer.js b/src/platforms/mp-weixin/helpers/create-media-query-observer.js
index 00b8265a5849191ed70b7d69cda5aad2a1757964..75ffbe8e79acdfdf3e541090156fd58059fdf9e1 100644
--- a/src/platforms/mp-weixin/helpers/create-media-query-observer.js
+++ b/src/platforms/mp-weixin/helpers/create-media-query-observer.js
@@ -1,91 +1,91 @@
 export default function createMediaQueryObserver () {
-    const mediaQueryObserver = {}
-    const {
-      windowWidth,
-      windowHeight
-    } = __GLOBAL__.getSystemInfoSync()
-  
-    const orientation = windowWidth < windowHeight ?  'portrait' : 'landscape'
-  
-    mediaQueryObserver.observe = (options, callback) => {
-      let matches = false
-      for (const item in options) {
-        const itemValue = item === 'orientation' ? options[item] : Number(options[item])
-        if (options[item] !== '') {
-          if (item === 'width'){
-            if (itemValue == windowWidth) {
-              matches = true
-            } else {
-              matches = false
-              callback(matches)
-              return matches
-            }
+  const mediaQueryObserver = {}
+  const {
+    windowWidth,
+    windowHeight
+  } = __GLOBAL__.getSystemInfoSync()
+
+  const orientation = windowWidth < windowHeight ? 'portrait' : 'landscape'
+
+  mediaQueryObserver.observe = (options, callback) => {
+    let matches = false
+    for (const item in options) {
+      const itemValue = item === 'orientation' ? options[item] : Number(options[item])
+      if (options[item] !== '') {
+        if (item === 'width') {
+          if (itemValue === windowWidth) {
+            matches = true
+          } else {
+            matches = false
+            callback(matches)
+            return matches
           }
-          if (item === 'minWidth'){
-            if (windowWidth >= itemValue) {
-              matches = true
-            } else {
-              matches = false
-              callback(matches)
-              return matches
-            }
+        }
+        if (item === 'minWidth') {
+          if (windowWidth >= itemValue) {
+            matches = true
+          } else {
+            matches = false
+            callback(matches)
+            return matches
           }
-          if (item === 'maxWidth'){
-            if (windowWidth <= itemValue) {
-              matches = true
-            } else {
-              matches = false
-              callback(matches)
-              return matches
-            }
+        }
+        if (item === 'maxWidth') {
+          if (windowWidth <= itemValue) {
+            matches = true
+          } else {
+            matches = false
+            callback(matches)
+            return matches
           }
-          
-          if (item === 'height'){
-            if (itemValue == windowHeight) {
-              matches = true
-            } else {
-              matches = false
-              callback(matches)
-              return matches
-            }
+        }
+
+        if (item === 'height') {
+          if (itemValue === windowHeight) {
+            matches = true
+          } else {
+            matches = false
+            callback(matches)
+            return matches
           }
-          if (item === 'minHeight'){
-            if (windowHeight >= itemValue) {
-              matches = true
-            } else {
-              matches = false
-              callback(matches)
-              return matches
-            }
+        }
+        if (item === 'minHeight') {
+          if (windowHeight >= itemValue) {
+            matches = true
+          } else {
+            matches = false
+            callback(matches)
+            return matches
           }
-          if (item === 'maxHeight'){
-            if (windowHeight <= itemValue) {
-              matches = true
-            } else {
-              matches = false
-              callback(matches)
-              return matches
-            }
+        }
+        if (item === 'maxHeight') {
+          if (windowHeight <= itemValue) {
+            matches = true
+          } else {
+            matches = false
+            callback(matches)
+            return matches
           }
-    
-          if (item === 'orientation'){
-            if (options[item] === orientation) {
-              matches = true
-            }  else {
-              matches = false
-              callback(matches)
-              return matches
-            }
+        }
+
+        if (item === 'orientation') {
+          if (options[item] === orientation) {
+            matches = true
+          } else {
+            matches = false
+            callback(matches)
+            return matches
           }
         }
       }
-      callback(matches)  
-      
-      return matches
-    }
- 
-    mediaQueryObserver.disconnect = () => {
     }
-    
-    return mediaQueryObserver
-}
\ No newline at end of file
+    callback(matches)
+
+    return matches
+  }
+
+  mediaQueryObserver.disconnect = () => {
+  }
+
+  return mediaQueryObserver
+}