#image #firebase #react-native #google-cloud-firestore #uri
#изображение #firebase #react-native #google-облако-firestore #uri
Вопрос:
Я сделал запрос, чтобы получить все поля определенного документа из Firestore. Одним из этих полей является массив изображений, взятых из хранилища Firebase. Я не знаю почему, но я не могу получить эти изображения.
РЕДАКТИРОВАТЬ: я попытался добавить abc после журнала, перед изображением, ничего не отображается.
Вот мой код:
const [photo, setPhoto] = useState([]);
useEffect(() => {
handlClick();
}, []);
const handlClick = () => {
var i = 0;
setRestaurant([]);
setPhoto([]);
db.doc(idBranch).get().then(data => {
const branchData = data.data();
setRestaurant(branchData);
const ph = branchData.Photo;
ph.forEach(pho =>{
setPhoto(p => [...p, pho]);
})
})
}
return (
{photo amp;amp; photo.forEach((ph) => {
<View>
<Text> {console.log(ph)}</Text>
<Image source = {{uri : ph}}/>
</View>
})}
)
Консоль.лог верен (даже если они извлекаются более одного раза каждый и не должны этого делать), здесь изображение:
Здесь структура Firestore:
Пожалуйста, помогите мне понять, что я должен сделать, чтобы получить изображения.
Комментарии:
1. Попробуйте добавить стиль в <Image /> добавление стиля={{ширина: 200, высота: 200})
2. По-прежнему ничего…
3. Я не думаю, что это проблема с изображением, я редактирую вопрос, добавляю текст, но все равно ничего не отображается
Ответ №1:
Ваш функциональный компонент должен возвращать JSX, но не объект. Также вы должны использовать .map
метод, если хотите отображать JSX через цикл. Попробуйте это:
return (
<View>
{photo amp;amp; photo.map((ph) => (
<View>
<Text>{console.log(ph)}</Text>
<Image source = {{uri : ph}}/>
</View>
))
}
</View>
)