diff options
| author |  Nate Moore <natemoo-re@users.noreply.github.com>
| 2021-06-24 17:48:24 -0500 |
|---|---|---|
| committer |  GitHub <noreply@github.com>
| 2021-06-24 17:48:24 -0500 |
| commit | a136c85e6b2b0445e48184595b2696994621c8f1 (patch) | |
| tree | 4d06743cf5b0e3f8f5dabcd1c8ae9e8b9b4557b2 /examples/blog/src | |
| parent | bc9e0f180ccec7d48fde49c857188543e007bf14 (diff) | |
| download | astro-a136c85e6b2b0445e48184595b2696994621c8f1.tar.gz astro-a136c85e6b2b0445e48184595b2696994621c8f1.tar.zst astro-a136c85e6b2b0445e48184595b2696994621c8f1.zip | |
New Props API (#515)
* wip: update props api
* feat(#139, #309): enable new props api
* chore: migrate examples to new props API
* docs: update syntax guide for new props API
* chore: update examples to new props API
* chore: update docs to new Props API
* fix: hide __astroInternal from `Astro.props` consumers
* chore: remove scratchpad file
* chore: fix script error
* test: fix failing collection tests
* fix: set __astroInternal to `enumerable: false`
* chore: add changeset
* feat: warn users using old props api
Diffstat (limited to 'examples/blog/src')
| -rw-r--r-- | examples/blog/src/components/MainHead.astro | 19 | ||||
| -rw-r--r-- | examples/blog/src/components/Nav.astro | 7 | ||||
| -rw-r--r-- | examples/blog/src/components/Pagination.astro | 8 | ||||
| -rw-r--r-- | examples/blog/src/components/PostPreview.astro | 7 | ||||
| -rw-r--r-- | examples/blog/src/layouts/post.astro | 5 | ||||
| -rw-r--r-- | examples/blog/src/pages/$author.astro | 3 | ||||
| -rw-r--r-- | examples/blog/src/pages/$posts.astro | 2 |
7 files changed, 32 insertions, 19 deletions
diff --git a/examples/blog/src/components/MainHead.astro b/examples/blog/src/components/MainHead.astro index dfc47fc01..fbdaa2965 100644 --- a/examples/blog/src/components/MainHead.astro +++ b/examples/blog/src/components/MainHead.astro @@ -1,12 +1,15 @@ --- -// props -export let title: string; -export let description: string; -export let image: string | undefined; -export let type: string | undefined; -export let next: string | undefined; -export let prev: string | undefined; -export let canonicalURL: string | undefined; +export interface Props { + title: string; + description: string; + image?: string; + type?: string; + next?: string; + prev?: string; + canonicalURL?: string; +} + +const { title, description, image, type, next, prev, canonicalURL } = Astro.props as Props; --- <!-- Common --> diff --git a/examples/blog/src/components/Nav.astro b/examples/blog/src/components/Nav.astro index 5c435b737..a7ef0985f 100644 --- a/examples/blog/src/components/Nav.astro +++ b/examples/blog/src/components/Nav.astro @@ -1,5 +1,8 @@ --- -export let title; +export interface Props { + title: string; +} +const { title } = Astro.props; --- <style lang="scss"> @@ -57,4 +60,4 @@ a { <li><a href="/author/sancho">Author: Sancho</a></li> <li><a href="/about">About</a></li> </ul> -</nav>
\ No newline at end of file +</nav> diff --git a/examples/blog/src/components/Pagination.astro b/examples/blog/src/components/Pagination.astro index 0294e1707..401931c07 100644 --- a/examples/blog/src/components/Pagination.astro +++ b/examples/blog/src/components/Pagination.astro @@ -1,6 +1,10 @@ --- -export let prevUrl: string; -export let nextUrl: string; +export interface Props { + prevUrl: string; + nextUrl: string; +} + +const { prevUrl, nextUrl } = Astro.props; --- <style lang="scss"> diff --git a/examples/blog/src/components/PostPreview.astro b/examples/blog/src/components/PostPreview.astro index d02a23fe6..b126ca2fb 100644 --- a/examples/blog/src/components/PostPreview.astro +++ b/examples/blog/src/components/PostPreview.astro @@ -1,6 +1,9 @@ --- -export let post; -export let author; +export interface Props { + post: any; + author: string; +} +const { post, author } = Astro.props; function formatDate(date) { return new Date(date).toUTCString().replace(/(\d\d\d\d) .*/, '$1'); // remove everything after YYYY diff --git a/examples/blog/src/layouts/post.astro b/examples/blog/src/layouts/post.astro index 3379bd2dc..c8f394892 100644 --- a/examples/blog/src/layouts/post.astro +++ b/examples/blog/src/layouts/post.astro @@ -1,10 +1,9 @@ --- import MainHead from '../components/MainHead.astro'; import Nav from '../components/Nav.astro'; - -export let content; - import authorData from '../data/authors.json'; + +const { content } = Astro.props; --- <html> diff --git a/examples/blog/src/pages/$author.astro b/examples/blog/src/pages/$author.astro index 687cabb42..e06d8bc94 100644 --- a/examples/blog/src/pages/$author.astro +++ b/examples/blog/src/pages/$author.astro @@ -12,7 +12,8 @@ const author = authorData[collection.params.author]; // collection import authorData from '../data/authors.json'; -export let collection: any; + +let { collection } = Astro.props; export async function createCollection() { /** Load posts */ let allPosts = Astro.fetchContent('./post/*.md'); diff --git a/examples/blog/src/pages/$posts.astro b/examples/blog/src/pages/$posts.astro index 688ec734d..0975e8007 100644 --- a/examples/blog/src/pages/$posts.astro +++ b/examples/blog/src/pages/$posts.astro @@ -11,7 +11,7 @@ let canonicalURL = Astro.request.canonicalURL; // collection import authorData from '../data/authors.json'; -export let collection: any; +let { collection } = Astro.props; export async function createCollection() { return { /** Load posts, sort newest -> oldest */ |