小编R. *_*son的帖子

Vue组件-渲染位置错误

我看到Vue组件和内联模板之间有奇怪的行为。

示例#1:内联模板

这正在按预期方式工作。vue组件按下面的示例#2不变,唯一的区别是我已将模板内容作为内联模板复制到了标签中。

参见:https : //jsfiddle.net/pobffmnv/

<div class="panel panel-primary">
    <div class="panel-heading">Current Clients</div>
    <table class="table table-hover">
        <thead>
            <tr>
                <th>Client Name</th>
                <th style="text-align: center;">No. Projects</th>
                <th style="text-align: center;">Time (7 days)</th>
                <th style="text-align: center;">Edit</th>
            </tr>
        </thead>
        <tbody>
            <clientlistitem inline-template>
                <tr>
                    <td>Test</td>
                    <td style="text-align: center;">0</td>
                    <td style="text-align: center;">0</td>
                    <td style="text-align: center;">
                        <div class="btn-group btn-group-xs" role="group">
                            <button type="button" class="btn small btn-primary">Edit</button>
                        </div>
                    </td>
                </tr>
            </clientlistitem>
        </tbody>
    </table>
</div>
Run Code Online (Sandbox Code Playgroud)

正确显示以下内容: 正确

范例2:非内联

以下是我的Vue模板。下面是更改代码以删除嵌入式模板。

参见:https : //jsfiddle.net/Ld47hoy2/

<template>
    <tr>
        <td>Test</td>
        <td style="text-align: center;">0</td>
        <td …
Run Code Online (Sandbox Code Playgroud)

javascript vue.js vue-component vuejs2

5
推荐指数
1
解决办法
875
查看次数

标签 统计

javascript ×1

vue-component ×1

vue.js ×1

vuejs2 ×1