快速应用程序开发与实时加载
到目前为止，我们已经看到开发一个跨平台的应用程序是多么容易。开发体验非常快，但如果我告诉你有一种方法可以更快呢?
我们可以使用Ionic的CLIbetway东盟体育app 生活重新加载功能 来提高我们在开发Ionic应用程序时的生产力。betway东盟体育app当激活时，Live Reload将重新加载浏览器和/或WebView，当应用程序中的变化被检测到。
生活重新加载
还记得
betway东盟体育app离子服务
？这是在浏览器中运行的Live Reload，允许我们快速迭代。
我们也可以在iOS和Android设备上使用它。这在编写与本地插件交互的代码时特别有用。因为我们需要在设备上运行本地插件代码，以验证其是否有效，所以拥有一种快速编写代码、构建和部署代码的方法，然后进行测试对保持我们的开发速度至关重要。
让我们使用Live Reload来实现照片删除，这是photo Gallery功能中缺失的部分。选择您选择的平台(iOS或Android)，并将设备连接到您的计算机。接下来，根据所选平台在终端中运行任意一个命令:
＄
betway东盟体育app离子帽运行ios -l——external
＄
betway东盟体育app离子帽运行android -l -外部Live Reload服务器将启动，如果还没有打开，则会打开所选的本地IDE。在IDE中，单击Play按钮将应用程序启动到设备上。
删除照片
随着Live Reload的运行和应用程序在您的设备上打开，让我们实现照片删除功能。开放
Tab2.vue
然后导入
actionSheetController
．我们将显示一个
IonActionSheet
带有删除照片的选项:
进口
｛
actionSheetController
，
IonPage
，
IonHeader
，
IonFab
，
IonFabButton
，
betway东盟体育appIonIcon
，
IonToolbar
，
IonTitle
，
IonContent
，
IonImg
，
IonGrid
，
IonRow
，
IonCol
｝
从
“@betway东盟体育appionic / vue”
；
/ /其他进口
接下来,参考
deletePhoto
函数，我们很快就会创建:
设置
（
）
｛
｝
常量
｛
照片
，
takePhoto
，
deletePhoto
｝
=
usePhotoGallery
（
）
；
｝
当用户点击图片时，我们会显示动作表单。对象中添加一个单击处理程序
< ion-img >
元素:
<
ion-img
: src
=
＂
photo.webviewPath
＂
@click
=
＂
showActionSheet(图)
＂
>
ion-img
>
接下来,在
设置()
,叫
创建
函数打开一个对话框，该对话框可以选择删除所选照片或取消(关闭)对话框:
常量
showActionSheet
=
异步
（
照片
：
照片
）
= >
｛
常量
actionSheet
=
等待
actionSheetController
．
创建
（
｛
头
：
“照片”
，
按钮
：
［
｛
文本
：
“删除”
，
角色
：
“破坏性的”
，
图标
：
垃圾
，
处理程序
：
（
）
= >
｛
deletePhoto
（
照片
）
；
｝
｝
，
｛
文本
：
“取消”
，
图标
：
关闭
，
角色
：
“取消”
，
处理程序
：
（
）
= >
｛
//无事可做，动作表单自动关闭
｝
｝
］
｝
）
；
等待
actionSheet
．
现在
（
）
；
｝
接下来,返回
showActionSheet
功能:
返回
｛
照片
，
takePhoto
，
showActionSheet
，
相机
，
垃圾
，
关闭
｝
接下来，我们需要实现
deletePhoto
方法
usePhotoGallery
函数。打开文件，然后添加:
常量
deletePhoto
=
异步
（
照片
：
照片
）
= >
｛
//从照片引用数据数组中删除这张照片
照片
．
价值
=
照片
．
价值
．
过滤器
（
p
= >
p
．
filepath
= = !
照片
．
filepath
）
；
//删除文件系统中的照片文件
常量
文件名
=
照片
．
filepath
．
字符串的子串
（
照片
．
filepath
．
lastIndexOf
（
' / '
）
+
1
）
；
等待
文件系统
．
deleteFile
（
｛
路径
：
文件名
，
目录
：
目录
．
数据
｝
）
；
｝
；
控件中删除所选照片
照片
数组，然后使用Filesystem API删除照片文件。
记住，删除照片从
照片
数组触发
cachePhotos
功能为我们自动:
常量
cachePhotos
=
（
）
= >
｛
存储
．
集
（
｛
关键
：
PHOTO_STORAGE
，
价值
：
JSON
．
stringify
（
照片
．
价值
）
｝
）
；
｝
看
（
照片
，
cachePhotos
）
；
最后,返回
deletePhoto
功能:
返回
｛
照片
，
takePhoto
，
deletePhoto
｝
；保存该文件，然后再次点击照片，选择“删除”选项。这次，照片被删除了!使用Live Reload实现得更快。
接下来是什么?
恭喜你!您创建了一个完整的跨平台图片库应用程序，可在web、iOS和Android上运行。
从这里开始有很多路可以走。尝试添加另一个2018必威体育下载 到应用程序，或更多 本机功能 ．前途无量。
应用程序构建快乐!