vue:两个内容只能显示其中之一

<el-table ref="multipleParameterTable" :data="form.parameter" highlight-current-row :class="ParameterTyep? 'parameter-a': 'parameter-b'" @selection-change="selsChangeParameter">

                            <el-table-column type="selection" min-width="5%" label="头部">

                            </el-table-column>

                            <el-table-column prop="name" label="参数名" min-width="20%" sortable>

                                <template slot-scope="scope">

                                    <el-input v-model.trim="scope.row.name" :value="scope.row.name" placeholder="请输入参数值"></el-input>

                                </template>

                            </el-table-column>

                            <el-table-column prop="value" label="参数值" min-width="40%" sortable>

                                <template slot-scope="scope">

                                    <el-input v-model.trim="scope.row.value" :value="scope.row.value" placeholder="请输入参数值"></el-input>

                                </template>

                            </el-table-column>

                            <el-table-column label="操作" min-width="7%">

                                <template slot-scope="scope">

                                    <i class="el-icon-delete" style="font-size:30px;cursor:pointer;" @click="delParameter(scope.$index)"></i>

                                </template>

                            </el-table-column>

                            <el-table-column label="" min-width="10%">

                                <template slot-scope="scope">

                                    <el-button v-if="scope.$index===(form.parameter.length-1)" size="mini" class="el-icon-plus" @click="addParameter"></el-button>

                                </template>

                            </el-table-column>

                            <el-table-column label="" min-width="18%"></el-table-column>

                        </el-table>

 

 

<template>

                            <el-input :class="ParameterTyep? 'parameter-b': 'parameter-a'" type="textarea" :rows="5" placeholder="请输入内容" v-model.trim="form.parameterRaw"></el-input>

                        </template>

 

data:

 

  ParameterTyep: true,

 

style

 .parameter-a {

        display: block;

    }

    .parameter-b {

        display: none;

    }

posted @ 2019-03-01 14:42  hayabky  阅读(1078)  评论(0)    收藏  举报