NextJs: компонент одного и того же класса для разных путей с getServerSideProps без повторного рендеринга
У меня есть две страницы с одним и тем же компонентом
Posts
это требует
searchModel
в качестве опоры, когда я изменяю путь с помощью Next Link, компонент никогда не выполняет повторный рендеринг, если страница не обновлена. Мой код:
index.js
export default function Home({ posts, searchModel }) {
const postsProps = {
posts: posts.records,
totalCount: posts.totalCount,
searchModel
}
return <Posts {...postsProps} />
}
export async function getServerSideProps() {...}
category / [id] / [slug].js
export default function Category({ posts, searchModel ,category,error}) {
const postsProps = {
posts: posts.records,
totalCount: posts.totalCount,
searchModel,
title: category.title
}
return <Posts {...postsProps} />
}
export async function getServerSideProps() {
try {
const { params } = context
const category = (await CategoryService.getById(params.id)).data
const searchModel = {
...Utils.getInitialSearchModel(),
categoryId: params.id
}
const posts = (await PostService.search(searchModel)).data
return { props: { posts, searchModel, category } }
} catch (error) {
return { props: { error } }
}
}
и сообщения:
class Posts extends Component {
constructor(props) {
super(props);
console.log({ posts: props.posts }) // runs only once, on page load, will never hit on next link click
this.state = {
posts: props.posts,
totalCount: props.totalCount,
searchModel: props.searchModel,
}
}
componentDidMount = () =>{
console.log('component mounted') // this never hits on page change
}
// ....
Я что-то делаю не так? Могу ли я обойти это без использования componentDidUpdate ()?