我想使用:
homePage.image = 'storage/' 'rkiGXBj7KJSOtsR5jiYTvNOajnzo7MlRAoXOXe3V.jpg'
里面:
<div class="home-image" :style="{'background-image': 'url(' homePage.image ')'}"></div>
在 Vue 組件被渲染但homePage.image回傳之前""。
這是我的組件:
<template>
<section id="home" class="home">
<div class="image-container">
<div class="home-image" :style="{'background-image': 'url(' homePage.image ')'}"></div>
</div>
</section>
</template>
<script setup>
import {ref} from 'vue';
const homePage = ref({
image: ""
});
axios.get('/home')
.then(res => {
homePage.image = 'storage/' 'rkiGXBj7KJSOtsR5jiYTvNOajnzo7MlRAoXOXe3V.jpg'; // storage link image file name
})
.catch(err => {
console.log(err.response);
});
// works
// const image = 'storage/' 'rkiGXBj7KJSOtsR5jiYTvNOajnzo7MlRAoXOXe3V.jpg';
</script>
如何在從函式內部將其加載到組件之前homePage.image進行更新?'storage/' 'rkiGXBj7KJSOtsR5jiYTvNOajnzo7MlRAoXOXe3V.jpg'axios
uj5u.com熱心網友回復:
當您ref用于反應性時,您必須使用value:
homePage.value.image = require('storage/' 'rkiGXBj7KJSOtsR5jiYTvNOajnzo7MlRAoXOXe3V.jpg');
轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/332922.html
標籤:阿贾克斯 Vue.js 公理 Vuejs3 vue-composition-api
上一篇:從部分提交訊息中構建提交訊息
下一篇:等待fetch獲取資料
