{"id":4165,"date":"2022-04-12T17:28:23","date_gmt":"2022-04-12T17:28:23","guid":{"rendered":"https:\/\/ionicframework.com\/blog\/?p=4165"},"modified":"2022-04-14T18:06:14","modified_gmt":"2022-04-14T18:06:14","slug":"announcing-ionic-v6-1","status":"publish","type":"post","link":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1","title":{"rendered":"Announcing Ionic v6.1"},"content":{"rendered":"<p>We added many new component features in v6.0, including the bottom sheet modal, revamped <code>ion-datetime<\/code>, and declarative overlays. In v6.1, we\u2019re excited to add all sorts of enhancements to those components, making it easier than ever for developers to build and ship robust mobile apps.<\/p>\n<p>Let\u2019s dive into the new features we\u2019re adding in Ionic 6.1.<\/p>\n<p><!--more--><\/p>\n<h2>Sheet Modal Breakpoint API<\/h2>\n<p>We\u2019ve upgraded the new sheet modals to give developers more control over the user\u2019s experience. The new <code>setCurrentBreakpoint<\/code> method can move the modal programmatically. Plus, the <code>getCurrentBreakpoint<\/code> method and <code>ionBreakpointDidChange<\/code> event let you respond to users\u2019 actions in order to handle more complex interactions between UI elements.<\/p>\n<pre><code class=\"language-html\">&lt;ion-button id=&quot;trigger-button&quot;&gt;Open modal&lt;\/ion-button&gt;\n&lt;ion-modal trigger=&quot;trigger-button&quot;&gt;\n  &lt;ion-content&gt;\n    Modal content\n    &lt;ion-button id=&quot;move-breakpoint&quot;&gt;Move breakpoint&lt;\/ion-button&gt;\n  &lt;\/ion-content&gt;\n&lt;\/ion-modal&gt;\n\n&lt;script&gt;\n  const sheetModal = document.querySelector(&#039;ion-modal&#039;);\n\n  sheetModal.breakpoints = [0, 0.25, 0.5, 1];\n  sheetModal.initialBreakpoint = 0.5;\n\n  sheetModal.addEventListener(&#039;ionBreakpointDidChange&#039;, ev =&gt; {\n    console.log(&#039;breakpoint changed&#039;, ev.detail.breakpoint);\n  });\n\n  const moveBreakpointBtn = document.querySelector(&#039;#move-breakpoint&#039;);\n  moveBreakpointBtn.addEventListener(&#039;click&#039;, () =&gt; {\n    sheetModal.setCurrentBreakpoint(0.75);\n  });\n&lt;\/script&gt;\n<\/code><\/pre>\n<div style=\"max-width:360px; margin: 0 auto;\">\n  <div class=\"device-demo\">\n            <figure>\n                <figcaption>Modal Breakpoint API Demo<\/figcaption>\n                <video src=\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/04\/ionic-6-1-set-breakpoints-new.mov\" controls autoplay muted loop><\/video>\n            <\/figure>\n        <\/div>\n<\/div>\n<h2>Control When Your Modals Dismiss<\/h2>\n<p>We\u2019ve added a new property to <code>ion-modal<\/code> called <code>canDismiss<\/code>, which lets you control precisely when users can leave a modal. Set it to a boolean for direct control, or an asynchronous function for things like showing a confirmation dialog.<\/p>\n<p>There\u2019s even a spring effect in the animation, for a smooth look and feel. Fancy!<\/p>\n<div style=\"max-width:360px; margin: 0 auto;\">\n  <div class=\"device-demo\">\n            <figure>\n                <figcaption>Modal Dismiss Demo<\/figcaption>\n                <video src=\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/04\/can-dismiss-demo.mov\" controls autoplay muted loop><\/video>\n            <\/figure>\n        <\/div>\n<\/div>\n<h2>Disable Specific Dates<\/h2>\n<p>Another property we\u2019re excited to add is <code>isDateEnabled<\/code>, for <code>ion-datetime<\/code>. This is a function that gives developers complete control over the logic behind disabling certain dates. Disable individual days, weekends, whole months, anything you like. Combine these with <code>ion-datetime<\/code>\u2019s <code>min<\/code> and <code>max<\/code> properties for ultimate flexibility.<\/p>\n<pre><code class=\"language-ts\">function isDateEnabled(dateIsoString: string) {\n  const date = new Date(dateIsoString);\n  const dayOfWeek = date.getDay();\n  return dayOfWeek !== 5 &amp;&amp; dayOfWeek !== 6;\n}\n<\/code><\/pre>\n<div style=\"max-width:360px; margin: 0 auto;\">\n  <div class=\"device-demo\">\n            <figure>\n                <figcaption>Disable Specific Dates Demo<\/figcaption>\n                <video src=\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/04\/dates.mov\" controls autoplay muted loop><\/video>\n            <\/figure>\n        <\/div>\n<\/div>\n<h2>Gesture Events for Range<\/h2>\n<p><code>ion-range<\/code> is getting two new events: <code>ionKnobMoveStart<\/code> and <code>ionKnobMoveEnd<\/code>. These fire at the start and end of the user\u2019s gesture, letting developers respond to interaction every step of the way. These events also play nice with <code>ion-range<\/code>\u2019s keyboard support.<\/p>\n<div style=\"max-width:360px; margin: 0 auto;\">\n  <div class=\"device-demo\">\n            <figure>\n                <figcaption>Gesture Events for Range Demo<\/figcaption>\n                <video src=\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/04\/range.mov\" controls autoplay muted loop><\/video>\n            <\/figure>\n        <\/div>\n<\/div>\n<h2>Custom Item Counters<\/h2>\n<p>Currently, when using an <code>ion-item<\/code> with an <code>ion-input<\/code> or <code>ion-textarea<\/code>, you can use the <code>counter<\/code> property to show how close the user is to hitting the max input length. With this new release, developers can now customize how the counter is formatted using the new <code>counterFormatter<\/code> property. You can show not just character counts, but whatever text you\u2019d like.<\/p>\n<pre><code class=\"language-ts\">function counterFormatter(length: number, maxlength: number) {\n  return `${maxlength - length} characters remaining`;\n}\n<\/code><\/pre>\n<div style=\"max-width:360px; margin: 0 auto;\">\n  <div class=\"device-demo\">\n            <figure>\n                <figcaption>Custom Item Counters Demo<\/figcaption>\n                <video src=\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/04\/item.mov\" controls autoplay muted loop><\/video>\n            <\/figure>\n        <\/div>\n<\/div>\n<h2>Virtual Scrolling Compatibility<\/h2>\n<p>Finally, we\u2019ve made it easier to use Ionic with your favorite third party virtual scrolling library, by adding the <code>ion-content-scroll-host<\/code> class to your custom scroll container. Any components that used to depend on <code>ion-content<\/code> for their scroll-based behavior will now use your new element instead. They\u2019ll keep all their functionality with no extra effort on your end.<\/p>\n<h3>React (react-virtuoso)<\/h3>\n<pre><code class=\"language-tsx\">const Footer = () =&gt; {\n  return (\n    &lt;IonInfiniteScroll threshold=&quot;100px&quot;&gt;\n      &lt;IonInfiniteScrollContent&gt;&lt;\/IonInfiniteScrollContent&gt;\n    &lt;\/IonInfiniteScroll&gt;\n  )\n}\n\nconst Example = () =&gt; (\n  &lt;IonPage&gt;\n    &lt;IonContent fullscreen scrollY={false}&gt;\n      &lt;Virtuoso \n        className=&quot;ion-content-scroll-host&quot;\n        data={items}\n        style={{ height: &quot;100%&quot; }}\n        itemContent={(item) =&gt; &lt;IonItem&gt;{item}&lt;\/IonItem&gt;}\n        components={{ Footer }} \/&gt;\n    &lt;\/IonContent&gt;\n  &lt;\/IonPage&gt;\n);\n<\/code><\/pre>\n<h3>Vue (vue-virtual-scroller)<\/h3>\n<pre><code class=\"language-html\">&lt;template&gt;\n  &lt;ion-page&gt;\n    &lt;ion-content :fullscreen=&quot;true&quot; :scroll-y=&quot;false&quot;&gt;\n      &lt;RecycleScroller \n        class=&quot;ion-content-scroll-host scroller&quot;\n        :items=&quot;items&quot;\n        :item-size=&quot;50&quot;\n      &gt;\n      &lt;template v-slot=&quot;{ item }&quot;&gt;\n        &lt;ion-item&gt;{{ item }}&lt;\/ion-item&gt;\n      &lt;\/template&gt;\n      &lt;template #after&gt;\n        &lt;ion-infinite-scroll threshold=&quot;100px&quot;&gt;\n          &lt;ion-infinite-scroll-content&gt;&lt;\/ion-infinite-scroll-content&gt;\n        &lt;\/ion-infinite-scroll&gt;\n      &lt;\/template&gt;\n      &lt;\/RecycleScroller&gt;\n    &lt;ion-content&gt;\n  &lt;\/ion-page&gt;\n&lt;\/template&gt;\n\n&lt;style scoped&gt;\n  .scroller {\n    height: 100%;\n  }\n&lt;\/style&gt;\n<\/code><\/pre>\n<h3>Angular (@angular\/cdk\/scrolling)<\/h3>\n<pre><code class=\"language-html\">&lt;ion-content [fullscreen]=&quot;true&quot; [scrollY]=&quot;false&quot;&gt;\n  &lt;cdk-virtual-scroll-viewport itemSize=&quot;50&quot; class=&quot;ion-content-scroll-host&quot;&gt;\n    &lt;ion-item *cdkVirtualFor=&quot;let item of items&quot;&gt;\n      {{ item }}\n    &lt;\/ion-item&gt;\n    &lt;ion-infinite-scroll threshold=&quot;100px&quot;&gt;\n      &lt;ion-infinite-scroll-content&gt;&lt;\/ion-infinite-scroll-content&gt;\n    &lt;\/ion-infinite-scroll&gt;\n  &lt;\/cdk-virtual-scroll-viewport&gt;\n&lt;\/ion-content&gt;\n<\/code><\/pre>\n<h2>What\u2019s Next?<\/h2>\n<p>With Ionic 6.1 out in the wild, we\u2019re going full steam ahead on the next version, bringing even more developer experience enhancements to your doorstep. We\u2019re especially excited about the upcoming component playground for our documentation. This will make it a breeze to see how Ionic components behave in real time without having to spin up your own application.<\/p>\n<p>While you\u2019re getting your hands dirty with the new improvements, if you have ideas for making them even better, <a href=\"https:\/\/github.com\/ionic-team\/ionic-framework\/issues\/new\/choose\">let us know on our Github repo<\/a>. The 6.1 release would not have been possible without massive community contributions, and we look forward to keeping the relationship strong as we move into future releases. Thank you!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>We added many new component features in v6.0, including the bottom sheet modal, revamped ion-datetime, and declarative overlays. In v6.1, we\u2019re excited to add all sorts of enhancements to those components, making it easier than ever for developers to build and ship robust mobile apps. Let\u2019s dive into the new features we\u2019re adding in Ionic [&hellip;]<\/p>\n","protected":false},"author":95,"featured_media":4166,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"publish_to_discourse":"0","publish_post_category":"23","wpdc_auto_publish_overridden":"","wpdc_topic_tags":"","wpdc_pin_topic":"","wpdc_pin_until":"","discourse_post_id":"545494","discourse_permalink":"https:\/\/forum.ionicframework.com\/t\/announcing-ionic-v6-1\/222386","wpdc_publishing_response":"","wpdc_publishing_error":"","_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[1,120],"tags":[3],"class_list":["post-4165","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-all","category-announcements","tag-ionic"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v23.0 (Yoast SEO v23.0) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Announcing Ionic v6.1 - Ionic Blog<\/title>\n<meta name=\"description\" content=\"In v6.1, we\u2019re excited to add all sorts of enhancements, making it easier than ever for developers to build and ship robust mobile apps.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Announcing Ionic v6.1\" \/>\n<meta property=\"og:description\" content=\"In v6.1, we\u2019re excited to add all sorts of enhancements, making it easier than ever for developers to build and ship robust mobile apps.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1\" \/>\n<meta property=\"og:site_name\" content=\"Ionic Blog\" \/>\n<meta property=\"article:published_time\" content=\"2022-04-12T17:28:23+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-04-14T18:06:14+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/04\/ionic-6.1-feature-image.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1600\" \/>\n\t<meta property=\"og:image:height\" content=\"880\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Amanda Smith\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@ionicframework\" \/>\n<meta name=\"twitter:site\" content=\"@ionicframework\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Amanda Smith\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1#article\",\"isPartOf\":{\"@id\":\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1\"},\"author\":{\"name\":\"Amanda Smith\",\"@id\":\"https:\/\/ionic.io\/blog\/#\/schema\/person\/c129cbda8f68555b68a87ec9b6f137ba\"},\"headline\":\"Announcing Ionic v6.1\",\"datePublished\":\"2022-04-12T17:28:23+00:00\",\"dateModified\":\"2022-04-14T18:06:14+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1\"},\"wordCount\":577,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/ionic.io\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1#primaryimage\"},\"thumbnailUrl\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/04\/ionic-6.1-feature-image.png\",\"keywords\":[\"Ionic\"],\"articleSection\":[\"All\",\"Announcements\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1\",\"url\":\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1\",\"name\":\"Announcing Ionic v6.1 - Ionic Blog\",\"isPartOf\":{\"@id\":\"https:\/\/ionic.io\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1#primaryimage\"},\"image\":{\"@id\":\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1#primaryimage\"},\"thumbnailUrl\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/04\/ionic-6.1-feature-image.png\",\"datePublished\":\"2022-04-12T17:28:23+00:00\",\"dateModified\":\"2022-04-14T18:06:14+00:00\",\"description\":\"In v6.1, we\u2019re excited to add all sorts of enhancements, making it easier than ever for developers to build and ship robust mobile apps.\",\"breadcrumb\":{\"@id\":\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1#primaryimage\",\"url\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/04\/ionic-6.1-feature-image.png\",\"contentUrl\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/04\/ionic-6.1-feature-image.png\",\"width\":1600,\"height\":880,\"caption\":\"Ionic v.61\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/ionic.io\/blog\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Announcing Ionic v6.1\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/ionic.io\/blog\/#website\",\"url\":\"https:\/\/ionic.io\/blog\/\",\"name\":\"ionic.io\/blog\",\"description\":\"Build amazing native and progressive web apps with the web\",\"publisher\":{\"@id\":\"https:\/\/ionic.io\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/ionic.io\/blog\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/ionic.io\/blog\/#organization\",\"name\":\"Ionic\",\"url\":\"https:\/\/ionic.io\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/ionic.io\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2020\/10\/white-on-color.png\",\"contentUrl\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2020\/10\/white-on-color.png\",\"width\":1920,\"height\":854,\"caption\":\"Ionic\"},\"image\":{\"@id\":\"https:\/\/ionic.io\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/x.com\/ionicframework\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/ionic.io\/blog\/#\/schema\/person\/c129cbda8f68555b68a87ec9b6f137ba\",\"name\":\"Amanda Smith\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/ionic.io\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/04\/professional-pic-square-150x150.png\",\"contentUrl\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/04\/professional-pic-square-150x150.png\",\"caption\":\"Amanda Smith\"},\"description\":\"Engineer on the Framework team at Ionic.\",\"sameAs\":[\"https:\/\/www.linkedin.com\/in\/amanda-smith-656699120\/\"],\"gender\":\"female\",\"knowsLanguage\":[\"English\"],\"jobTitle\":\"Software Engineer\",\"worksFor\":\"Ionic\",\"url\":\"https:\/\/ionic.io\/blog\/author\/amanda\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Announcing Ionic v6.1 - Ionic Blog","description":"In v6.1, we\u2019re excited to add all sorts of enhancements, making it easier than ever for developers to build and ship robust mobile apps.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1","og_locale":"en_US","og_type":"article","og_title":"Announcing Ionic v6.1","og_description":"In v6.1, we\u2019re excited to add all sorts of enhancements, making it easier than ever for developers to build and ship robust mobile apps.","og_url":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1","og_site_name":"Ionic Blog","article_published_time":"2022-04-12T17:28:23+00:00","article_modified_time":"2022-04-14T18:06:14+00:00","og_image":[{"width":1600,"height":880,"url":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/04\/ionic-6.1-feature-image.png","type":"image\/png"}],"author":"Amanda Smith","twitter_card":"summary_large_image","twitter_creator":"@ionicframework","twitter_site":"@ionicframework","twitter_misc":{"Written by":"Amanda Smith","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1#article","isPartOf":{"@id":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1"},"author":{"name":"Amanda Smith","@id":"https:\/\/ionic.io\/blog\/#\/schema\/person\/c129cbda8f68555b68a87ec9b6f137ba"},"headline":"Announcing Ionic v6.1","datePublished":"2022-04-12T17:28:23+00:00","dateModified":"2022-04-14T18:06:14+00:00","mainEntityOfPage":{"@id":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1"},"wordCount":577,"commentCount":0,"publisher":{"@id":"https:\/\/ionic.io\/blog\/#organization"},"image":{"@id":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1#primaryimage"},"thumbnailUrl":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/04\/ionic-6.1-feature-image.png","keywords":["Ionic"],"articleSection":["All","Announcements"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/ionic.io\/blog\/announcing-ionic-v6-1#respond"]}]},{"@type":"WebPage","@id":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1","url":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1","name":"Announcing Ionic v6.1 - Ionic Blog","isPartOf":{"@id":"https:\/\/ionic.io\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1#primaryimage"},"image":{"@id":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1#primaryimage"},"thumbnailUrl":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/04\/ionic-6.1-feature-image.png","datePublished":"2022-04-12T17:28:23+00:00","dateModified":"2022-04-14T18:06:14+00:00","description":"In v6.1, we\u2019re excited to add all sorts of enhancements, making it easier than ever for developers to build and ship robust mobile apps.","breadcrumb":{"@id":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/ionic.io\/blog\/announcing-ionic-v6-1"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1#primaryimage","url":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/04\/ionic-6.1-feature-image.png","contentUrl":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/04\/ionic-6.1-feature-image.png","width":1600,"height":880,"caption":"Ionic v.61"},{"@type":"BreadcrumbList","@id":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/ionic.io\/blog"},{"@type":"ListItem","position":2,"name":"Announcing Ionic v6.1"}]},{"@type":"WebSite","@id":"https:\/\/ionic.io\/blog\/#website","url":"https:\/\/ionic.io\/blog\/","name":"ionic.io\/blog","description":"Build amazing native and progressive web apps with the web","publisher":{"@id":"https:\/\/ionic.io\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/ionic.io\/blog\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/ionic.io\/blog\/#organization","name":"Ionic","url":"https:\/\/ionic.io\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/ionic.io\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2020\/10\/white-on-color.png","contentUrl":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2020\/10\/white-on-color.png","width":1920,"height":854,"caption":"Ionic"},"image":{"@id":"https:\/\/ionic.io\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/x.com\/ionicframework"]},{"@type":"Person","@id":"https:\/\/ionic.io\/blog\/#\/schema\/person\/c129cbda8f68555b68a87ec9b6f137ba","name":"Amanda Smith","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/ionic.io\/blog\/#\/schema\/person\/image\/","url":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/04\/professional-pic-square-150x150.png","contentUrl":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/04\/professional-pic-square-150x150.png","caption":"Amanda Smith"},"description":"Engineer on the Framework team at Ionic.","sameAs":["https:\/\/www.linkedin.com\/in\/amanda-smith-656699120\/"],"gender":"female","knowsLanguage":["English"],"jobTitle":"Software Engineer","worksFor":"Ionic","url":"https:\/\/ionic.io\/blog\/author\/amanda"}]}},"jetpack_sharing_enabled":true,"jetpack_featured_media_url":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/04\/ionic-6.1-feature-image.png","_links":{"self":[{"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/posts\/4165","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/users\/95"}],"replies":[{"embeddable":true,"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/comments?post=4165"}],"version-history":[{"count":0,"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/posts\/4165\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/media\/4166"}],"wp:attachment":[{"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/media?parent=4165"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/categories?post=4165"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/tags?post=4165"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}