Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

v-if in template element do not report non-existant variables #6725

Closed
Oscar-ren opened this issue Sep 30, 2017 · 5 comments
Closed

v-if in template element do not report non-existant variables #6725

Oscar-ren opened this issue Sep 30, 2017 · 5 comments

Comments

@Oscar-ren
Copy link

Version

2.4.4

Reproduction link

https://jsfiddle.net/9x0pvs9y/

Steps to reproduce

When judging whether to show the scopedSlots template

What is expected?

expected scopedSlots template can show/hidden base on if condition

What is actually happening?

template doesn't care v-if

I know I can put the v-if on the parent tag, but this will have some redundancy
@posva
Copy link
Member

posva commented Sep 30, 2017

In your example, the isShow is not being ignored, it doesn't exist in the context where it's used, it only exist in the component. However, it should show an error saying isShow is not defined

@posva posva changed the title scopedSlots don't support v-if v-if in template element do not report non-existant variables Sep 30, 2017
@Oscar-ren
Copy link
Author

as i think, isShow not defined then the v-if will get false, but it still display

@yyx990803
Copy link
Member

Using v-if on a scoped slot doesn't make sense, because <template> in this case is just an abstract container for the inner template. We can add a warning for it though.

@hezhongfeng hezhongfeng mentioned this issue Jan 3, 2018
Closed
@hezhongfeng
Copy link

hezhongfeng commented Jan 3, 2018 •
edited

I know I can put the v-if on the parent tag, but this will have some redundancy

how to do this?
I tested，It's invalid.

@hezhongfeng
Copy link

hezhongfeng commented Jan 3, 2018 •
edited

@yyx990803
I want to control the <template> existing or not.
since v-if is doesn't make sense, how can I do?

    <el-table-column v-for="(header, index) of tableHeaders" :key="index">
      <div slot-scope="scope" v-if="header.multipleRow">
        <div class="biz-customcol">
          <img :src="scope.row[header.prop].img" alt="">
          <div class="biz-two-row">
            <span style="margin-left: 10px">{{ scope.row[header.prop].value1 }}</span>
            <span style="margin-left: 10px">{{ scope.row[header.prop].value2 }}</span>
          </div>
        </div>
      </div>
    </el-table-column>

<template> is invalid when I add a wrap for the <template> like this.

    <el-table-column v-for="(header, index) of tableHeaders" " :key="index">
      <div v-if="header.multipleRow">
        <div slot-scope="scope">
          <div class="biz-customcol">
            <img :src="scope.row[header.prop].img" alt="">
            <div class="biz-two-row">
              <span style="margin-left: 10px">{{ scope.row[header.prop].value1 }}</span>
              <span style="margin-left: 10px">{{ scope.row[header.prop].value2 }}</span>
            </div>
          </div>
        </div>
      </div>
    </el-table-column>

ztlevi pushed a commit to ztlevi/vue that referenced this issue Feb 14, 2018
@yyx990803 @ztlevi
fix: perperly handle v-if on <template> scoped slot
3b062dc 
fix vuejs#6725
f2009 pushed a commit to f2009/vue that referenced this issue Jan 25, 2019
@yyx990803
fix: perperly handle v-if on <template> scoped slot
e82c265 
fix vuejs#6725
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@yyx990803 @posva @Oscar-ren @hezhongfeng