Question

I simply try to let VueJS 2 render a inline condition while I add a value to an dom element. I know, that it is possible to use { "browser": { "vue": "vue/dist/vue.common.js" }, } to let elements appear or disappear based on conditions, but how can I use a inline-condition?

I will give an example. The following html describe my idea and I know that this lines generates an error. Both index.html elements are controlled by conditions which lets them appear or not and this works fine.

Now, I try to bind a value to the App.vue attribute depending on a condition (which are in the parentheses for example).

v-if

So after rendering by VueJS the <span> tag should be like:

href

OR

<div id="vuemain">
<span v-if="diced < 6">Looser</span>
<span v-if="diced == 6">Winner</span>
<a :href="'https://link-to-whatever.com/'+{diced==6 : 'winner', diced<6 : 'looser'} ">LINK</a>
</div>

Do you understand what my problem is and is that somehow possible?

Many thanks in advance

Allan

Answer 1

This should work.

class MemoryPoolObject
{
public:
    MemoryPoolObject()
    {
        // Count the number of times objects are constructed
        MemoryManager::get().objectConstructed();
    }

    virtual ~MemoryPoolObject()
    {
        // Count the number of times objects are destructed
        MemoryManager::get().objectDestructed();
    }

    static void* operator new (size_t s)
    {
        // Get memory from the pool, count the number of times called
        return MemoryManager::get().allocate(s);
    }

    static void operator delete (void* ptr, size_t s)
    {
        // Return memory to the pool, track a bunch of stats
        MemoryManager::get().deallocate(ptr, s);
    }
};

It looks like you were trying to use the object syntax, which won't really work in this case. Instead, just use the ternary above.

VueJS 2 conditional rendering in value binding

1 个答案: