title: How to handle data in react from mysql and also with changing a input select values?
body: <p>I have this react form which gets prepopulated from mysql.  It's a comma delimited field and it loads on the page correctly from the database values.  My problem is that when you select another value it's no longer a comma delimited string but an array.  I'm just not sure how to handle both data formats.  Here's my react code...</p>
  <pre><code>  const updateFieldHandler = (key, convert) =&gt; e =&gt; {
      setSubmissionData({
        ...submissionData,
        [key]: convert ? convert(e.target.value) : e.target.value
      });
      };
      ...
        &lt;FormControl fullWidth className={classes.selectFormControl}&gt;
          &lt;label
            htmlFor=&quot;simple-select&quot;
            className={classes.selectLabel}
          &gt;What do you want?{&quot; &quot;}
          &lt;/label&gt;
          &lt;Select
            MenuProps={{
              className: classes.selectMenu
            }}
            classes={{
              select: classes.chrisHelp
            }}
            multiple
            input={&lt;Input  /&gt;}          
            renderValue={selected =&gt; selected.join(&quot;, &quot;)}
            onChange={updateFieldHandler(&quot;issue_description&quot;)}
            inputProps={{
              name: &quot;issue_description&quot;,
              id: &quot;issue_description&quot;,
              value: submissionData?.issue_description?.split(&quot;,&quot;).map((description) =&gt; {return description}) || []
            }}
          &gt;
  </code></pre>
  <p>Once I add a selection manually I get this error....</p>
  <pre><code>_submissionData$issue.split is not a function
  </code></pre>
  <p>on this line...</p>
  <pre><code>value: submissionData?.issue_description?.split(&quot;,&quot;).map((description) =&gt; {return description}) || []
  </code></pre>