Javascript 在React Native上接收消息MQTT时更新值？

我对使用React还相当陌生，我正在做一个项目来学习

当我在mqtt中收到带有this.setState的消息时，我试图更新一个值，但它抛出了一个错误（this.setState不是函数）

import'/App.css'；
从“./components/Chart”导入圆环图；
var mqtt=require（'mqtt'）
var host='ws://localhost:9003'
var client=mqtt.connect（主机）
类应用程序扩展组件{
构造函数（）{
超级（）；
此.state={
答复：[5,7]，
答复2:[5,7]，
}
}
componentDidMount（）{
client.on（'connect'，function（）{
console.log（'客户端已连接：'）
subscribe（'topic'，{qos:0}）
})
client.on（'message'，函数（主题、消息、数据包）{
console.log（'收到的消息：='+消息.toString（）+'\n主题：='+主题）
this.setState（{response2:[4,96]}）；
})
}
render（）{
返回(
);
}
}
导出默认应用程序；

kkk

import './App.css';
import DoughnutChart from './components/Chart';

var mqtt = require('mqtt')
var host = 'ws://localhost:9003'
var client = mqtt.connect(host)

class App extends Component {
  constructor(){
    super();
    this.state = {
      response: [5,7],
      response2: [5,7],
    }
  }
  componentDidMount() {
    
    client.on('connect', function () {
      console.log('client connected:')
      client.subscribe('topic', { qos: 0 })
    })

    client.on('message', function (topic, message, packet) {
      console.log('Received Message:= ' + message.toString() + '\nOn topic:= ' + topic)
      this.setState({ response2: [4,96]});
    })
    
    
  }

  render() {
    return (
      <div className="App">
          <DoughnutChart id="Tercer" temp={this.state.response}/>
          <DoughnutChart id="cuarto" temp={this.state.response2}/>
      </div>
    );
    
  }
}

export default App;