next.js 如何在Strapi v4中创建动态段塞?

k4aesqcs  于 2023-06-05  发布在  其他
关注(0)|答案(3)|浏览(457)

我想创建一个slug的网址,只要用户添加一个事件从前端。slug基于事件的名称。如何在V4中做到这一点,因为旧的方法现在不起作用?
Slug creation link - old version

35g0bw71

35g0bw711#

通过阅读本文,您似乎正在尝试向模型中添加生命周期事件。您需要对文章进行以下修改,使其适用于v4。
在通过管理 Jmeter 板创建文章模型之后,而不是添加以下文件:

./api/article/models/Article.js

添加:

./src/api/article/content-types/article/lifecycles.js

其中包括:

const slugify = require('slugify');

module.exports = {
    async beforeCreate(event) {
      if (event.params.data.title) {
        event.params.data.slug = slugify(event.params.data.title, {lower: true});
      }
    },
    async beforeUpdate(event) {
      if (event.params.data.title) {
        event.params.data.slug = slugify(event.params.data.title, {lower: true});
      }
    },
};

此外,API端点在v4中发生了变化,因此您需要用途:

GET /api/articles?filters[slug]=my-article-slug
zbdgwd5y

zbdgwd5y2#

这个好像对我有用
Settings > Roles > Public > Slugify(checkbox findSlug)config/plugins.js

module.exports = ({ env }) => ({
  slugify: {
    enabled: true,
    config: {
      contentTypes: {
        page: {
          field: "slug",
          references: "name",
        },
        post: {
          field: "slug",
          references: "name",
        },
        category: {
          field: "slug",
          references: "name",
        },
      },
    },
  },
});

图形

const POSTS = gql`
  query GetPosts {
    posts {
      ... on PostEntityResponseCollection {
        data {
          __typename
          id
          attributes {
            __typename
            name
            slug
            content
            featuredImage {
              data {
                __typename
                id
                attributes {
                  url
                  alternativeText
                  caption
                }
              }
            }
            createdAt
          }
        }
      }
    }
  }
`;

const POST = gql`
  query GetPost($slug: String!) {
    findSlug(modelName: "post", slug: $slug, publicationState: "live") {
      ... on PostEntityResponse {
        data {
          __typename
          id
          attributes {
            createdAt
            name
            slug
            content
            seo {
              __typename
              id
              title
              description
              blockSearchIndexing
            }
            categories {
              __typename
              data {
                __typename
                id
                attributes {
                  __typename
                  name
                  slug
                }
              }
            }
          }
        }
      }
    }
  }
`;
7bsow1i6

7bsow1i63#

在Strapi项目中,可以在api/collection-name/content-type/collection-name文件夹中创建lifecycles.js文件。在此文件中,您可以定义要为指定内容类型执行的生命周期方法。

module.exports = {
             async beforeCreate(event) {

             // Generate slug using the 'plugin::content-manager.uid' service

             const slug = await strapi.service('plugin::content-manager.uid').generateUIDField({
             contentTypeUID: 'api::product.product'// Replace 'product' with your collection name,
             field: 'slug', // Replace 'slug' with the desired field name
             data: event.params.data
       }); 

         

         // Assign the generated slug to the 'slug' field
         event.params.data.slug = slug;

         // Assign the generated slug to the 'slug2' field (if needed)
         event.params.data.slug2 = slug;
       }
      };

说明:

  • beforeCreate方法是在指定集合中创建新条目之前触发的生命周期钩子。
  • beforeCreate方法是在指定集合中创建新条目之前触发的生命周期钩子。
  • 在beforeCreate方法内部,来自plugin::content-manager. uid服务的generateUIDField方法用于为条目生成一个唯一的slug。
  • generateUIDField方法需要contentTypeUID、field和data参数。请确保将"product"替换为您实际的收藏名称,并将"slug"替换为所需的字段名称。
  • 生成的slug被分配给www.example.com对象的slug字段,该字段表示新条目的数据。event.params.data object, which represents the data for the new entry.
  • 如果您需要将相同的slug分配给另一个字段(例如slug2),则可以添加一行来将slug值也分配给该字段。

注意:请确保文件名为lifecycles.js,并放置在上述正确的文件夹结构中。
您可以根据自己的具体要求(如字段名和集合名)随意调整代码。

相关问题