- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在使用 Alpine 显示将更改的项目列表。但是我不知道如何告诉 Alpine 在新的项目从服务器返回后刷新项目列表:
<div x-data=" items() ">
<template x-for=" item in items " :key=" item ">
<div x-text=" item.name "></div>
</template>
</div>
第一个“批次”的项目很好,因为它们被硬编码在
items()
中。功能:
function items(){
return {
items: [
{ name: 'aaron' },
{ name: 'becky' },
{ name: 'claude' },
{ name: 'david' }
]
};
}
Alpine 之外的一些代码获取并接收一个全新的项目列表,我想显示它而不是原始集合。我无法弄清楚如何,或者目前是否可能。感谢您的任何指针。
最佳答案
有3种方法可以解决这个问题。
this.items
function items(){
return {
items: [
{ name: 'aaron' },
{ name: 'becky' },
{ name: 'claude' },
{ name: 'david' }
],
updateItems() {
// something, likely using fetch('/your-data-url').then((res) => )
this.items = newItems;
}
};
}
rootElement.__x.$data
并设置 __x.$data.items = someValue
<script>
// some other script on the page
// using querySelector assumes there's only 1 Alpine component
document.querySelector('[x-data]').__x.$data.items = [];
</script>
x-on:items-load.window="items = $event.detail.items"
:
<div x-data=" items() " x-on:items-load.window="items = $event.detail.items">
<template x-for=" item in items " :key=" item ">
<div x-text=" item.name "></div>
</template>
</div>
触发自定义事件的代码,您需要填写有效负载。
<script>
let event = new CustomEvent("items-load", {
detail: {
items: []
}
});
window.dispatchEvent(event);
</script>
关于alpine.js - 在 AlpineJS 中事后刷新数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63233506/
所以最近(9 月 5 日)Alpine Linux 软件包仓库更新为 postgresql-client 12.4 我在我的 Dockerfile ( apk add postgresql-clien
当我运行 apk add --update ab 时出现错误: bash-4.3# apk add --update ab fetch http://dl-cdn.alpinelinux.org/al
关闭。这个问题不满足Stack Overflow guidelines .它目前不接受答案。 想改善这个问题吗?更新问题,使其成为 on-topic对于堆栈溢出。 9 个月前关闭。 Improve t
我有一个在 Alpine 发行版上运行的 docker 镜像,为了让我的一个要求工作 - pocketsphinx==0.1.15,我必须在我的 DockerFile 中安装一些依赖项: FROM p
我已按照以下步骤创建自定义 rootfs 镜像以使用 firecracker 启动:- https://github.com/firecracker-microvm/firecracker/blob/
关闭。这个问题不符合Stack Overflow guidelines .它目前不接受答案。 这个问题似乎不是关于 a specific programming problem, a softwar
我正在使用 alpine(最低 3.5)并且我需要使用 nodeJS 4.8.4 Docker 文件 FROM alpine:3.5 RUN apk add --update nodejs=4.8.4
使用 ruby-2.6.6-alpine 的 Docker 镜像创建了一个 498mb 的镜像大小。但是,当我降级到 ruby-2.6.5-alpine 时,它又回到了 266mb。 2.
我尝试在php:7.0-fpm-alpine上安装bz2扩展(基于Alpine 3.4): FROM php:7.0-fpm-alpine RUN docker-php-ext-install bz2
1、运行 fonts ,打开字体文件夹,找到要用的字体文件; 2、修改Dockerfile,例如: ?
我有这个Dockerfile ... FROM keymetrics/pm2:latest-alpine RUN apk update && \ apk upgrade && \ ap
我已经阅读了很多有关Docker容器和Unikernel的知识,以及如何在自己的应用程序中运行轻量级环境。 我知道Linux容器和Unikernel是不同的东西,因为第一个是内核功能(例如 names
我有一个 docker 镜像 nginx:stable-alpine,我需要使用 nginx-extras 为了使用 rewrite_by_lua指示。 我尝试通过 apk add --cached
堆高车 我正在使用Docker容器化我的应用程序。在下面的stage中,我尝试使用UPX对其进行打包。 FROM alpine:3.8 AS compressor # Version of upx t
我在CI / CD机器上使用Alpine linux。下面的docker文件: FROM node:10.15-alpine RUN npm i -g sequelize sequelize-cli
我正在尝试使用 The Badass Runtime Plugin 创建自定义运行时图像然后在 Alpine 上执行它。但它失败并显示以下错误消息。 jibcmd_1 | /bin/sh: exec
如何为所有语言安装字体?这是我的工作,但是Chrome中没有日语字体。 从此图像:https://github.com/Zenika/alpine-chrome/blob/master/Dockerf
是否可以在 Alpine Linux 中的 less 命令上启用鼠标滚动? 我尝试过使用 export LESS=-R 但没有任何作用。 最佳答案 Alpine 上默认的 less 由 BusyBox
我正在尝试在 alpine 中安装一个包,在本例中我指定了“jasper-dev”,但我和其他许多人都遇到过这种情况。我在终端中得到的输出是: / # apk add jasper-dev ERROR
当尝试安装 pdftk apk 时抛出此错误。 ERROR: unsatisfiable constraints: pdftk (missing): required by: world[
我是一名优秀的程序员,十分优秀!