微信小程序（新人自学笔记）-优快云博客

微信小程序

微信小程序开发中遇到的问题

微信小程序开发中遇到的问题

微信小程序图片加载失败渲染层网络层错误

报错:
Failed to load image/pages/index/image/index.jpg : the server responded with a status of 404 (HTTP/1.1 404 Not Found)

可能的问题：
标签中少了一个斜杠
如：

   <image src='/image/2.jpg'></image>

写成

<image src='image/2.jpg'></image>

页面之间跳转

在app.json文件中的代码至少要有两个页面


{
  "pages": [
   "pages/login/loginUI",
   "pages/contact/index"
  ],
  "window": {
    "backgroundTextStyle": "light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "WeChat",
    "navigationBarTextStyle": "black"
  },
  "sitemapLocation": "sitemap.json"
}

界面loginUI.wxml中的代码要有navigator

navigator(链接)的使用：

<navigator url='地址'> “通过此进入'地址'所在的页面” </navigator>

如：

<!--pages/login/loginUI.wxml-->
<text>欢迎进入异次元</text>
<input placeholder='通行码'></input>
<navigator url='/pages/contact/index'>
 <button>进入次元</button>
</navigator>

布局的一种

将点击跳转的文字部分放在页面下方

js部分：

onWriteClick:function(event){
   
    wx.navigateTo({
      url: '/pages/doing/doing',
    })
  }

wxml部分：

<view class='footer' bind:tap='onWriteClick'>
  <view class='center'>开始书写
  </view>
</view>

wxss部分：

./**位置居中**/
.center{
  display: flex;
  align-items: center;
  justify-content: center;
}


.footer{
  background: rgb(8, 117, 94);
  color: #fff;
  line-height: 100rpx;
  flex: 0 0 100rpx;
  bottom: 20px;
}