CODEWITHSUNDEEP
javascriptreact-native
Syafiqur_
Syafiqur_

Reputation: 587

Boolean into String in React Native-JavaScript

So, I was working on a React Native project, I have a checkbox like this :

      import ARCheckBox from '@react-native-community/checkbox';
      .............
      <View style={styles.row}>
      <Text style={styles.label}>Insured Interest</Text>
         <Text>Section IV - AutomobileLiability</Text>
         <ARCheckBox
          value={this.state.arCBValue3}
          onValueChange={value =>
            this.setState({
              arCBValue3: value,
            })
          }
        />
      </View>

This is my .js for the output :

import { style } from "./../../../reports/ARCssPdf";

export const arGenerateFileHtml = values => {
  return`
  ${style}
  ${generateNameSectionHtml(values)}`;
};

const generateNameSectionHtml = name =>
`<html>
<head>
</head>
    <br/>
<body>
  <div>
      <table style="width:450px">
      <tr>
      <td> Section IV - AutomobileLiability</td>
      <th> : </th>
      <th> ${name.arCBValue3}</th> //This is the output
      </tr>
  </table>
</div>
</body>
</html>`

But the result I got like this :

Section IV - AutomobileLiability : true/false

While the result I want to is like this :

Section IV - AutomobileLiability : Yes/No

How do I get that result? I've tried using replace Function to replace the true/false into Yes/No, but it's not working. I know I have to make a function first, but I dont know how. Any help would be appreciate. Thanks

Upvotes: 0

Views: 312

Answers (2)

deepak
deepak

Reputation: 1375

import {
  style
} from "./../../../reports/ARCssPdf";

export const arGenerateFileHtml = values => {
  return `
  ${style}
  ${generateNameSectionHtml(values)}`;
};
const replacer = value => value ? "Yes" : "No"
const generateNameSectionHtml = name =>
  `<html>
<head>
</head>
    <br/>
<body>
  <div>
      <table style="width:450px">
      <tr>
      <td> Section IV - AutomobileLiability</td>
      <th> : </th>
      <th> ${replacer(name.arCBValue3)}</th> //This is the output
      </tr>
  </table>
</div>
</body>
</html>`
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>

Upvotes: 0

JB_DELR
JB_DELR

Reputation: 777

Did you try:

   <th> ${name.arCBValue3 ? 'Yes':'No'}</th>

Upvotes: 1

Related Questions