當(dāng)前位置:
首頁(yè) >
前端技术
> javascript
>内容正文
javascript
前端学习(1720):前端系列javascript之生命周期下
生活随笔
收集整理的這篇文章主要介紹了
前端学习(1720):前端系列javascript之生命周期下
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
page2.vue
<template><view>這是page2<button type="primary" @click="open">點(diǎn)擊跳轉(zhuǎn)</button></view> </template><script>export default {data() {return {}},onLoad() {console.log('page onload2')},//頁(yè)面渲染完成onReady(){console.log('page2 onReady')//獲取節(jié)點(diǎn)信息},//頁(yè)面顯示onShow(){console.log('page2 onShow')},//頁(yè)面隱藏onHide(){console.log('page2 onHide')},//頁(yè)面卸載onUnload(){console.log('page2 onunload')//請(qǐng)求后臺(tái)接口//渲染前得操作},methods: {open(){//打開(kāi)新頁(yè)面uni.navigateTo({url:'../pages/index/index?id=uniapp'})}}} </script><style></style>index.vue
<template><!-- <view class="content"><image class="logo" src="/static/logo.png"></image><view class="text-area"><text class="title">{{title}}</text></view></view> --><view><view class="box" hover-class="hoverclass">測(cè)試文字1</view><view class="box" hover-class="hoverclass">測(cè)試文字2</view><text>測(cè)試文字3</text><text>測(cè)試文字4</text><view class="image-box"><image src="../../static/logo.png" mode="aspectFit"></image></view><view>{{title}}</view></view> </template><script>export default {data() {return {title: ''}},//頁(yè)面加載onLoad(e) {console.log('page onload',e)this.title=e.id},//頁(yè)面渲染完成onReady(){console.log('page onReady')},//頁(yè)面顯示onShow(){console.log('page onShow')},//頁(yè)面隱藏onHide(){console.log('page onHide')},//頁(yè)面卸載onUnload(){console.log('page onunload')},methods: {}} </script><style>.box{border:1px solid red;}.hoverclass{background:#007AFF ;}.image-box{width: 100px;height: 100px;} </style>?
運(yùn)行結(jié)果
總結(jié)
以上是生活随笔為你收集整理的前端学习(1720):前端系列javascript之生命周期下的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: css之半透明遮罩
- 下一篇: 前端学习(1697):前端系列javas