Question

我尝试将inline-template与vue.js 2.0一起使用。

我将其与Laravel blade 5.4：

一起使用

<users inline-template>
    <tbody>
        @foreach($users as $user)
            <tr>
                <td>
                    {{ $user->name }}
                </td>

                <td>
                    {{ $user->last_name }}
                </td>

                <td>
                    {{ $user->created_at->diffForHumans() }}
                </td>

                @if($user->isActive())
                    <td>
                        <span class="tag is-success">Ja</span>
                    </td>
                @else
                    <td>
                        <span class="tag is-danger">Nee</span>
                    </td>
                @endif

                <td>
                    <span class="tag is-warning">Admin</span>
                </td>

                <td>
                    <i class="fa fa-eye" aria-hidden="true"></i>
                </td>
            </tr>
        @endforeach
    </tbody>
</users>

Vue组件：

  <script>
        export default {
            created() {
                alert('test');
            }
        }
    </script>

App.js：

Vue.component('users',                          require('./components/user/Users.vue'));

但我得到的错误如下：

未捕获的TypeError：无法读取属性＆＃39;键入＆＃39;未定义的在genInlineTemplate

这里有什么问题？有什么建议吗？

Answer 1

内联模板似乎不能很好地锁在<tr>标签上。

我在文档中找不到任何解释，但是通过包装<div>标签解决了这个问题。

<component inline-template>
     <div>
          <tr>
             <th>Something</th>
             <th>something</th>
             <th>something</th>
          </tr>
     </div>
</component>

Vue.js内联模板错误

1 个答案: