CODEWITHSUNDEEP
vuejs2vue-strap
ILya
ILya

Reputation: 121

Vue strap popover error

I have the following view: 

<div id="root" class="container">
    <template>
        <popover trigger="hover" effect="fade" placement="top" title="Title">
            <button class="btn btn-default">Popover on bottom</button>
        </popover>
    </template>
</div>

<script src="https://unpkg.com/[email protected]/dist/vue.js"></script>
<script src="lesson.js"> </script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue-strap/1.1.37/vue-strap.min.js"></script>

My lesson.js file looks the following:

new Vue({ el: "#root",

data: {
    content: 'Lorem ipsum dolor sit amet consectetur adipisicing elit, sed do eiusmod',
},

components: {
    popover: VueStrap.popover
},

});

But then I got the following error:

 [Vue warn]: failed to compile template:

    <span v-el:trigger> <slot></slot> <div v-el:popover v-if=show 
:class="['popover',placement]" :transition=effect> 
<div class=arrow></div> <h3 class=popover-title v-if=title> 
<slot name=title>{{title}}</slot> 
</h3> <div class=popover-content> <slot name=content>{{{content}}}</slot> 
</div> </div> </span>

    - invalid expression: {{{content}}}


    (found in component <popover>)

pls, help

Upvotes: 1

Views: 624

Answers (2)

ILya
ILya

Reputation: 121

Actually, there is another version of vue bootstrap which works without errors: https://bootstrap-vue.github.io/docs/setup/

Upvotes: 0

Kirill Matrosov
Kirill Matrosov

Reputation: 6000

It is compiling error

<slot name=content>{{{content}}}</slot>

Edited

And this error is in source of component

Upvotes: 1

Related Questions