title: The data property "bg" is already declared as a prop. Use prop default value instead. But, props doesnt include "bg"
body: <p>This code below makes an error.</p>
  
  <blockquote>
    <p>The data property "bg" is already declared as a prop. Use prop default
    value instead.</p>
  </blockquote>
  
  <p>But as you can see, props don't include <code>bg</code>... Why this error happens?</p>
  
  <pre class="lang-js prettyprint-override"><code>&lt;template&gt;
      &lt;div :class="[cls , colorFlag == true ? 'active':'']" :id="sid+'_box'" :style="{width: [width], height: [height], margin: [margin]}"&gt;
          &lt;div class="colorBtn"  :style="{background:bg, color:col}" @click="colorOpen"&gt;a&lt;/div&gt;
          &lt;ul class="colorList"&gt;
              &lt;li v-for="(cD, index) in defaultC" @click="changeColor($event,cD.bgF,cD.colF)" :style="{background:[cD.bgF], color:[cD.colF]}"&gt;a&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
      import mixin from '~/mixin/index.js'
  
      export default {
          name: "color",
          mixins: [mixin],
          props: {
              cls: {
                  type: String,
                  default: ''
              },
              val: {
                  type: [String, Number, Boolean, Object],
                  default: ''
              },
              sid: {
                  type: String,
                  default: ''
              },
              src: {
                  type: String,
                  default: ''
              }
          },
          data: () =&gt; ({
              fileName: '',
              fileSrc:'',
              colorFlag:false,
              defaultC:[
                  {bgF:'#E7E7E7', colF:'#464646'},
                  {bgF:'#B6CFF5', colF:'#0D3472'},
                  {bgF:'#98D7E4', colF:'#0D3B44'},
                  {bgF:'#E3D7E1', colF:'#3D188E'},
                  {bgF:'#FBD3E0', colF:'#711A36'},
                  {bgF:'#ffa333', colF:'#FFFFFF'},
              ],
              bg: '#FFC8AF',
              col: '#7A2E0B',
  
          }),
      }
  </code></pre>
  
  <p>This is html which call component</p>
  
  <pre><code>&lt;color cls="fl colorBox" width="48px" height="26px" margin="0 38px 0 0" @fChange="config.bgcolor, config.bgcolor" /&gt;
  </code></pre>