|
|
============================================================================================================
7. 怎么 才能让头部 的搜索框 和 右侧平高呢？
// 获取右侧胶囊按钮的位置信息 单位是px
let s = wx.getMenuButtonBoundingClientRect();
console.log(s);
然后拿到之后 做这么些操作：
1.在需要配置的wxml里 写
<view class="header-box" style="padding-top:{{mySize.headerBoxPaddingTop}}px;">
<view class="head" id="header-input">
<text class="head-address" style="line-height:{{mySize.headAddressLineHeight}}px;" >快捷搜索 </text>
<input type="text" class="keyword-input" id="keyword-input" style="height:{{mySize.keywordInputHeight}}px;" name="keyword" />
</view>
</view>
<view class="jia-header-box" style="height:{{mySize.jiaHeaderBoxHeight}}px;">
</view>
2.在page 里：
data: {
motto: '你好 陌生人',
userInfo: {},
hasUserInfo: false,
canIUse: wx.canIUse('button.open-type.getUserInfo'),
mySize:{
headerBoxPaddingTop:'',
keywordInputHeight:'',
headAddressLineHeight:'',
jiaHeaderBoxHeight:''
}
},
3. 在onload 里
// 获取右侧胶囊按钮的位置信息
let s = wx.getMenuButtonBoundingClientRect();
console.log(s);
// 设置左侧的
this.setHeader(s);
4. 然后写一个function
// 设置左侧搜索框
,setHeader:function( json )
{
this.setData({
mySize:{
headerBoxPaddingTop:json.top,
keywordInputHeight:json.height-2,
headAddressLineHeight:json.height-2,
jiaHeaderBoxHeight:json.bottom +6
}
})
}
==============================================================================================================
8. getElementById 不能用，那微信小程序时如何选择demo 节点的?
这先pass
===============================================================================================
9. 在微信小程序中 使用include 引入的公共头部，底部 到index/wxml 的css/js 写在哪?
9.1 答： 写在 index.wxss 与 index.js 中 ； 写在foot 的相关文件中并不生效 -。-
9.2 后来我把底部和头部换成了 组件 这样更方便点 ，
但是问题是我底下3个链接 也会跟着动 ，而不是 底下不动 上面不动 只动中间那种，应该怎么搞？
9.3 后来发现 有一个叫做 tabBar 的东西 -.-
"tabBar": {
"color": "#000", //文字默认颜色
"selectedColor": "#959394",//文字被选中时的颜色
"backgroundColor": "#f0f0f0",//背景色
"borderStyle": "white",//TAB栏边框颜色
"list": [
{
"pagePath": "pages/index/index", //导航页面
"iconPath": "pages/images/home_b.png",//默认图片路径
"selectedIconPath": "pages/images/home.png",//被选中时的图片路径
"text": "首页"
},
{
"pagePath": "pages/components/mine/mine",
"iconPath": "pages/images/mine_b.png",
"selectedIconPath": "pages/images/mine.png",
"text": "帮助"
}
]
},
备注：如果发现 调试里是三个 但是显示是两个，那一定是index页面出错了；
可以参考百度都链接： https://jingyan.baidu.com/article/414eccf6ba98696b421f0a6e.html
9.4 如果我部分页面 不需要 tabBar 应当如何设置；
载入页面，在页面onload 直行隐藏方法：
onLoad: function (options) {
// 隐藏底部的 tabBer
wx.hideTabBar({
animation : false
})
},
如何在别的页面再显示：
<button bindtap="toother" data-href="../index/index"> 跳转首页测试tabBer </button>
然后别的页面需要，则在别的页面里 写：
===================================================================================
10. 微信小程序有默认的padding 和maragin 嘛 ？
这一点 我居然没找到正确的解决方法，甚至连input 有没有1px 的边宽 我都不知道
=====================================================================================
11. 微信小程序自定义对象属性的获取
11.1 <view class="foot-item" bindtap="toother" data-href="../myinfo/myinfo">
<text class="foot-item-text">我的</text>
</view>
11.2 , toother:function(e)
{
// 跳转时，去拿自定义属性href的值
var href = e.currentTarget.dataset.href;
console.log(e.currentTarget);
wx.navigateTo({
url: href
})
}
11.3 注意对象自定义属性之前要加data-
参考链接：https://blog.csdn.net/Sindyue/article/details/100742629
|
|
发表于 2020-4-27 18:10:31