Merge pull request #11 from WeBankFinTech/fix/search

fix: network and console filter not work while data update

Author: kevin031612

library/plugins/components/Search.js

@@ -12,16 +12,38 @@ export default class Search extends Component {
     onChangeText: PropTypes.func,
     onEndText: PropTypes.func,
     onCleanText: PropTypes.func,
-    keyboardType: PropTypes.string
+    keyboardType: PropTypes.string,
+    onMaybeFinish:PropTypes.func
   }
   static defaultProps = {
     keyboardType: 'ascii-capable'
   }
+
+  constructor () {
+    super(...arguments)
+    this.state = {
+      value: this.props.value
+    }
+  }
   _onClean = () => {
     this.props.onCleanText && this.props.onCleanText('')
+    this.setState({
+      value: ''
+    })
   }
   _onChangeText = (text) => {
     this.props.onChangeText && this.props.onChangeText(text)
+
+    if (this.props.onMaybeFinish) {
+      if (this.textChangeTimer) {
+        clearTimeout(this.textChangeTimer)
+        this.textChangeTimer = false
+      }
+
+      this.textChangeTimer = setTimeout(() => {
+        this.props.onMaybeFinish(text)
+      }, 1000)
+    }
   }
   _onEndEditing = (event) => {
     this.props.onEndText && this.props.onEndText(event.nativeEvent.text)

library/plugins/console/Console.js

@@ -182,7 +182,7 @@ export default class Console extends Plugin {
     const warnList = []
     const errorList = []
     Console.cachedLogList.forEach((logItem) => {
-      if (!searchText2 || logsToString(logItem.msg).join('').toLowerCase().indexOf(searchText1) > -1) {
+      if (!searchText1 || logsToString(logItem.msg).join('').toLowerCase().indexOf(searchText1) > -1) {
         allList.push(logItem)
       }
       if (logItem.logType === Warn && (!searchText2 || logsToString(logItem.msg).join('').toLowerCase().indexOf(searchText2) > -1)) {
@@ -251,7 +251,7 @@ export default class Console extends Plugin {
     return (
       <Search
         keyboardType={'default'}
-        onEndText={this._updateListBySearchText}
+        onMaybeFinish={this._updateListBySearchText}
         onCleanText={this._updateListBySearchText}
         defaultValue={this.state.searchTextMap[this.tabName]} />
     )

library/plugins/network/Network.js

@@ -24,13 +24,13 @@ export default class Network extends Plugin {
     Network._proxyFetch = new ProxyFetch(window)
     Network._proxyFetch.onUpdate((fetchList) => {
       if (Network.currentInstance && !Network.currentInstance._isRender) {
-        Network.currentInstance._updateList(TABS.Request, fetchList)
+        Network.currentInstance._updateListBySearchText()
       }
     })
     // 请求重发更新
     Network._proxyFetch.onReUpdate((fetchList) => {
       if (Network.currentInstance && !Network.currentInstance._isRender) {
-        Network.currentInstance._updateList(TABS.ReRequest, fetchList)
+        Network.currentInstance._updateListBySearchText()
       }
     })
   }
@@ -85,7 +85,7 @@ export default class Network extends Plugin {
     })
   }
 
-  _updateListBySearchText = (searchText = '') => {
+  _updateListBySearchText = (searchText = this.state.searchTextMap[this.tabName]) => {
     const list = Network._getFetchList(this.tabName)
     this.setState({
       searchTextMap: {
@@ -105,9 +105,9 @@ export default class Network extends Plugin {
   _renderHeader = () => {
     return (
       <Search
-        onChangeText={this._updateListBySearchText}
+        onMaybeFinish={this._updateListBySearchText}
         onCleanText={this._updateListBySearchText}
-        value={this.state.searchTextMap[this.tabName]}
+        defaultValue={this.state.searchTextMap[this.tabName]}
       />
     )
   }

react-native-web-demo/src/App.js

@@ -25,6 +25,12 @@ class App extends React.Component {
     fetch('https://static.geetest.com/static/js/fullpage.8.9.600.js')
     fetch('https://static.geetest.com/static/wind/sprite2x.1.5.8.png')
     fetch('https://static.geetest.com/static/js/fullpage.8.9.6.js')
+    setInterval(() => {
+      fetch('https://static.geetest.com/static/js/fullpage.8.9.6.js?ts=' + new Date().getTime())
+      console.log('some log ' + new Date().getTime())
+      console.warn('some warning ' + new Date().getTime())
+      console.error('some error ' + new Date().getTime())
+    }, 5000)
   }
 
   render () {