Отправить значения ползунка через MQTT

Question

Я новичок в React Native и хотел бы использовать mqtt в приложении. Я пытаюсь отправить значения слайдера через mqtt. Я установил библиотеку mqtt после этого хранилища . Часть кода mqtt сама по себе работает, а часть слайдеров - сама по себе, но когда я соединяю оба кода вместе, я не могу собрать значения слайдера для отправки через mqtt.

import React, { Component } from 'react';
import { Slider, View, Text, StyleSheet } from 'react-native';
import  { connect } from 'mqtt';

var client  = connect('mqtt://broker.hivemq.com')

export default class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
      sliderValue: '0',
    };
  }

  render() {
    return (
      <View style = {styles.container}>
        <Text style = {{ color: 'black' }}>
          Value of this slider is : {this.state.sliderValue_1}
        </Text>

        <Slider
          maximumValue = "2"
          minimumValue = "0"
          step = "1"
          value_1 = {this.state.sliderValue}
          onValueChange = {sliderValue_1 => this.setState({ sliderValue_1 })}
        />

        <Text style = {{ color: 'black' }}>
          Value of this slider is : {this.state.sliderValue_2}
        </Text>

        <Slider
          maximumValue = "2"
          minimumValue = "0"
          step = "1"
          value_2 = {this.state.sliderValue_2}
          onValueChange = {sliderValue_2 => this.setState({ sliderValue_2 })}
        />
      </View>
    );
  }
}

client.on('connect', function () {
  client.subscribe('topic_1');
  client.subscribe('topic_2');
  client.publish('topic_1', (value_1));
  client.publish('topic_2', (value_2));
})

client.on('message', function (topic, message) {
  console.log(message.toString())
})

const styles = StyleSheet.create({
  container: {
    flex: 1,
    padding: 20,
    justifyContent: 'center',
    backgroundColor: '#ecf0f1',
  },
});