'Display Image From Database To Browser With Vue.js

<!-- SLIDER -->
<div id="slider">
    <div class="tp-banner-container">
        <div class="tp-banner">
            <ul>
                <li v-for="s in sliderData" data-transition="zoomout" data-masterspeed="1500">
                   <img v-bind:src="{{s.image}}" alt="" />

 
                    <div class="tp-caption impulse_big lfb fadeout"
                         data-x="20"
                         data-y="110"
                         data-speed="500"
                         data-start="900">
                         <a><span class="impulse_big_blck">{{s.imageHeader}}</span></a>
                    </div>
                     <div class="tp-caption impulse_small lfl fadeout"
                         data-x="20"
                         data-y="200"
                         data-speed="500"
                         data-start="1500">
                        <a class="impulse_big_blckK">"test"</a>
                    </div>
                </li>

            </ul>
        </div>
    </div>
</div>

I can't display the images in the database on the screen with vue.js.I am using ms sql for database.Browser gives this error in debug section.

vue.js:634 [Vue warn]: Error compiling template:

invalid expression: Unexpected token '{' in

    {{s.image}}

  Raw expression: v-bind:src="{{s.image}}"


4  |              <ul>
5  |                  <li v-for="s in sliderData" data-transition="zoomout" data-masterspeed="1500">
6  |                     <img v-bind:src="{{s.image}}" alt="">
   |                          ^^^^^^^^^^^^^^^^^^^^^^^^
7  |  
8  |   

(found in <Root>)

What should be the correct usage for this line of code ?

   <img v-bind:src="{{s.image}}" alt="" />  


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source