登录注册页
<h2>去掉原生导航栏</h2>
<p>位置：框架->国际化->pages.json国际化->titleNView->titleText</p>
<pre><code class="language-json">"app-plus":{
"titleNView":false
}</code></pre>
<p>app-plus位置：框架->配置->pages.json页面路由->pages->style->app-plus</p>
<h2>使用Vuex.Store</h2>
<p>/store/index.js</p>
<pre><code class="language-js">import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
export default new Vuex.Store({
state:{
user:null,
token:null
},
actions:{
// 初始化
init({ state }){
let user = uni.getStorageSync('user')
if(user){
state.user = JSON.parse(user)
state.token = state.user.token
}
},
login({ state },user){
state.user = user
state.token = user.token
// 存储在本地缓存中
uni.setStorageSync('user',JSON.stringify(user))
}
}
})</code></pre>
<p>main.js</p>
<pre><code class="language-js">import store from '@/store/index.js';
Vue.prototype.$store = store
// 其他页面都可以使用$store啦</code></pre>
<h2>验证同意隐私声明</h2>
<pre><code class="language-js">handleCheckboxChange(e){
this.confirm = !!e.detail.value.length
}</code></pre>
<h2>js中!和!!的用法</h2>
<ul>
<li>!取反，0,null、undefined和空字符串取反都为true，其余都为false</li>
</ul>
<pre><code class="language-js">!null // true
!undefined // true
!'' // true
!'null' // false
!0 // true</code></pre>
<ul>
<li>!!把目标值转化为布尔值，相当于使用Boolean()方法</li>
</ul>
<pre><code class="language-js">!!"123" 相当于是 Boolean("123") //结果为true
!!{a:1} 相当于是 Boolean({a:1}) //结果为true</code></pre>
<h2>发送验证码实例</h2>
<pre><code class="language-js"><template>
<view class="code-btn bg-main" hover-class="bg-main-hover" @click="sendCode">
{{ time > 0 ? (time + 's') : '发送' }}
</view>
</template>
<script>
let timer = null
export default {
name:"code-btn",
data() {
return {
time:0
};
},
methods: {
sendCode() {
if(this.time > 0){
return
}
this.time = 60
timer = setInterval(()=>{
this.time--
if(this.time <= 0){
clearInterval(timer)
}
},1000)
}
},
}
</script>
<style>
.code-btn{
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 200rpx;
font-size: 14px;
display: flex;
align-items: center;
justify-content: center;
color: #FFFFFF;
border-top-right-radius: 8rpx;
border-bottom-right-radius: 8rpx;
}
</style></code></pre>
<h2>权限验证跳转-个人中心模块</h2>
<ul>
<li>main.js</li>
</ul>
<pre><code class="language-js">Vue.prototype.navigateTo = function(url){
uni.navigateTo({
url,
});
}
Vue.prototype.authJump = function(url){
if(!store.state.token){
return uni.navigateTo({
url: '/pages/login/login'
});
}
if(!store.state.user.phone){
return uni.navigateTo({
url: '/pages/bind-phone/bind-phone'
});
}
uni.navigateTo({
url,
});
}</code></pre>