Hi, I'm trying to use the v-bind:style in my div to apply the textposit function with the textpos prop as a parameter. The function should adjust the style of the div based on the value of the parameter.
<div class="container" :style=" textposit(textpos) ">
<p class="headline">{{ headline }}</p>
<p class="text">{{ text }}</p>
</div>
Here is my script:
export default {
name: 'page',
components: {
},
props:{
headline: {
type: String,
},
text: {
type: String,
},
img: {
type: String,
},
align:{
type: String,
default: "center",
},
textpos:{
type: String,
default: "left",
},
textrows:{
type: Number,
default: 1,
}
},
methods:{
textposit (pos){
if (pos == "left") {
return{
"grid-column: 4 / 5"
}
}
else{
return{
"grid-column: 1 / 2"
}
}
}
}
}
I can see that the method is being called, but it's not changing the style of my div. Any help would be appreciated. Thank you!