Tag <slot> cannot appear inside <table> due to HTML content restrictions. It will be hoisted out of <table> by the browser

[avinash-mishra]

While running the above code I am getting the following error

ERROR in ./resources/assets/js/components/valuechain/DataViewer.vue

  51 |                 <tbody>
  52 |                     <slot v-for="item in model.data" :item="item"></slot>
    |                     ^
  53 |                 </tbody>
Tag cannot appear inside due to HTML content restrictions. It will be hoisted out of by the browser

Please suggest.

[anishdcruz]

This demo app is using an older version of Vue. Try upgrading to latest.

[avinash-mishra]

@anishdcruz thanks for reply. Here are my important composer.json content:

    "require": {
        "php": ">=5.6.4",
        "laravel/framework": "5.3.*",
        "laracasts/utilities": "~2.0"
    },
    "require-dev": {
        "fzaninotto/faker": "~1.4",
        "mockery/mockery": "0.9.*",
        "phpunit/phpunit": "~5.0",
        "symfony/css-selector": "3.1.*",
        "symfony/dom-crawler": "3.1.*"
    },

package.json

{
  "private": true,
  "scripts": {
    "prod": "gulp --production",
    "dev": "gulp watch"
  },
  "devDependencies": {
    "bootstrap-sass": "^3.3.7",
    "gulp": "^3.9.1",
    "laravel-elixir": "^6.0.0-14",
    "laravel-elixir-vue-2": "^0.3.0",
    "laravel-elixir-webpack-official": "^1.0.2"
  },
  "dependencies": {
    "axios": "^0.15.3",
    "vue": "^2.4.2",
    "vue-router": "^2.1.1"
  }
}

But still problem is persistent. Here I have asked the same in stackoverflow. Can you help what to do ? LInk: https://stackoverflow.com/questions/45996944/tag-slot-cannot-appear-inside-table-due-to-html-content-restrictions-it-wil