无法使preoload功能知道商店中的内容更改-sapper

时间:2020-05-01 20:44:08

标签: svelte sapper

我需要帮助,我一直为此苦苦挣扎,没有运气。我修改了博客示例以处理我的proyects部分。我设法通过自定义可写存储文件使它工作,我可以在存储内进行所有CRUD操作,并且会在需要它们的组件上对其进行更新。除了[slug] .svelte页面之外的所有内容。

似乎即使[slug] .JSON.js文件也具有预订,[slug] .svelte上下文模块在进行存储更改后也无法获取商店更改。

这是我的[slug] .JSON.js文件。

import proyectos from "./_projectsStore.js";
let projects;
proyectos.subscribe(p => {
    projects = p;
})

const lookup = new Map();
projects.forEach(project => {
    lookup.set(project.slug, JSON.stringify(project));
});

export function get(req, res, next) {
    // the `slug` parameter is available because
    // this file is called [slug].json.js
    const { slug } = req.params;

    if (lookup.has(slug)) {
        res.writeHead(200, {
            'Content-Type': 'application/json'
        });

        res.end(lookup.get(slug));
    } else {
        res.writeHead(404, {
            'Content-Type': 'application/json'
        });

        res.end(JSON.stringify({
            message: `Not found`
        }));
    }
}

对于我认为预加载功能存在问题的问题,该问题在更改后并不知道。

<script context="module">
  export async function preload({ params, query }) {
    // the `slug` parameter is available because
    // this file is called [slug].html
    const res = await this.fetch(`portafolio/${params.slug}.json`);
    const data = await res.json();
    if (res.status === 200) {
      return { project: data };
    } else {
      this.error(res.status, data.message);
    }
  }
</script>

有什么主意吗?

1 个答案:

答案 0 :(得分:1)

如果我的理解正确,您希望您的lookup映射始终包含到proyectos存储库最新的项目的块映射。

在这种情况下,填充地图的方式最多只能为您提供第一个版本(或者甚至会因错误而下降),因为地图没有以任何方式连接到proyectos商店。

连接它们的一种方法是在订阅功能内填充地图:

// [slug].json.js
const lookup = new Map();
proyectos.subscribe(p => {
  lookup.clear();
  p.forEach(project => {
    lookup.set(project.slug, JSON.stringify(project));
  });
})

这样,每次proyectos存储更改时,地图都会重新填充,这将使您的端点能够响应更改。