vue.js - How can I use multiple condition in v-if in VueJS?

Question

Here is my code:

JavaScript

let Names = [
{
Name: "Josh"
FullName: ""
},
{
Name: "Jonathan"
FullName: null
},
{
Name: "James"
FullName: "James Johnson"
}];

Index.Vue

<ul>
    <li v-for="item in Names" 
    v-if=" item.FullName != null || item.FullName != '' " >
     {{FullName}}
    </li>
</ul>

This v-if=" item.FullName != null || item.FullName != '' " does not work, Why? How can I put two condition inside a v-if?

Answer 1

Maybe it's the way you are treating empty strings as false-ly values and || is saying: show fullname if any of the two (left/right) expressions are true, which is not what you want I think.

Try this instead:

 <li v-for="item in Names" v-if="item.FullName !== null && item.FullName !== ''"> 

Also, judging from your code, {{ FullName }} should be {{ item.FullName }}