資訊專欄INFORMATION COLUMN
摘要：微信小程序的學(xué)習(xí)微信小程序的開始嘗試微信開發(fā)者工具生成目錄如下主頁(yè)日志頁(yè)面工具大體為每一個(gè)即是一個(gè)頁(yè)面文件，每個(gè)頁(yè)面有一個(gè)文件規(guī)定描述頁(yè)面的這四個(gè)文件必須具有相同的路徑與文件名。
微信小程序的學(xué)習(xí) 微信小程序的開始嘗試 TodoList 微信開發(fā)者工具生成 目錄如下：
.
|-- app.js
|-- app.json
|-- app.wxss
|-- pages
| |-- index # 主頁(yè)
| | |-- index.js
| | |-- index.json
| | |-- index.wxml
| | `-- index.wxss
| `-- log # 日志頁(yè)面
| | |-- log.js
| | |-- log.json
| | |-- log.wxml
| | `-- log.wxss
`-- utils # 工具
`-- util.js
大體為:
每一個(gè)page即是一個(gè)頁(yè)面文件 ，每個(gè)頁(yè)面有一個(gè)js/wxml/wxss/json文件 規(guī)定：描述頁(yè)面的這四個(gè)文件必須具有相同的路徑與文件名。
全局下同路，為公共的邏輯，樣式，配置
與html不同:用view text navigator 代替 div span a
官方文檔
*.wxml: 數(shù)據(jù)驅(qū)動(dòng)的視圖層 + 微信提供了大量的組件 表單 導(dǎo)航 媒體 ...
開始完成wxml ,我在這里主要分成三部分
1.titleBar
全部 未完成 已完成
2/scoll-view scroll-y class="lists"
{{item.title}} {{item.time}}
3/addForm
wxml 是一個(gè)模板 {{數(shù)據(jù)狀態(tài)}} 數(shù)據(jù)的綁定
動(dòng)態(tài)的 可編譯的 活的 data 是活的 setData 只要狀態(tài)一變 界面立即改變
我們?cè)谶@里使用了data 來表示數(shù)據(jù)屬性
寫完了wxml 那讓我們加上wxss樣式看看效果把
TodoList wxss
在wxss中我們使用了彈性布局flex:1, 這種布局的方式使得我們不用計(jì)算大小了
話不多說看看js的實(shí)現(xiàn)部分
數(shù)據(jù) 對(duì)應(yīng)著 界面狀態(tài)
默認(rèn)的status是1是全部 setData改變 比如改成2 setData 2 已完成 3 未完成
界面狀態(tài),全部被data接管起來
當(dāng)前點(diǎn)擊條目的status要變成 success 數(shù)據(jù) lists 跟當(dāng)前條目相關(guān)的數(shù)據(jù)
將status的值 更新為 1
這樣一個(gè)簡(jiǎn)單的TodoList框架就做好了
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/94961.html
摘要：微信小程序列表頁(yè)面簡(jiǎn)單的列表頁(yè)面和數(shù)據(jù)添加，此時(shí)有一些問題在清除一些用戶交互的頁(yè)面的時(shí)候有些問題。一個(gè)微信小程序，同時(shí)只能有個(gè)網(wǎng)絡(luò)請(qǐng)求連接?？赡芤诜?wù)器上配置一些參數(shù)，可以讓微信小程序調(diào)用基本上是沒有問題的。 weixinApp 微信小程序toDoList 列表頁(yè)面 簡(jiǎn)單的列表頁(yè)面和數(shù)據(jù)添加，此時(shí)有一些問題 setData在清除一些用戶交互的頁(yè)面的時(shí)候有些問題。 inputA 是一...
摘要：項(xiàng)目規(guī)劃本項(xiàng)目為基于微信手機(jī)應(yīng)用平臺(tái)的一款運(yùn)動(dòng)互動(dòng)型小程序，實(shí)現(xiàn)了用戶即時(shí)運(yùn)動(dòng)步數(shù)群內(nèi)與個(gè)人動(dòng)態(tài)的發(fā)布，小程序前端采用原生框架，后端采用基于的框架，數(shù)據(jù)庫(kù)采用，對(duì)象存儲(chǔ)采用七牛云，服務(wù)器采用阿里，域名采用認(rèn)證。 1. 項(xiàng)目規(guī)劃 本項(xiàng)目為基于微信手機(jī)應(yīng)用平臺(tái)的一款運(yùn)動(dòng)互動(dòng)型小程序，實(shí)現(xiàn)了用戶即時(shí)運(yùn)動(dòng)步數(shù)群內(nèi)PK與個(gè)人動(dòng)態(tài)的發(fā)布，小程序前端采用原生框架，后端采用基于Node的koa2框架，...
摘要：微信開發(fā)工具僅用于調(diào)試。下面可以配置一個(gè)微信小程序的參數(shù)，文件就是我們要編輯的頁(yè)面了。補(bǔ)充一下，調(diào)用之后獲取了經(jīng)緯度之后，還可以玩玩微信的組件。試著用微信寫一個(gè)組件。 下周公司要搞黑客馬拉松了，組里可能會(huì)做個(gè)小程序。然后看到了mpvue感覺還不錯(cuò)，于是就打算試試水。用vue寫小程序聽上去美滋滋。那么先開始吧！ 全局安裝 vue-cli $ npm install --global vu...
閱讀 3435·2021-10-20 13:49
閱讀 2808·2021-09-29 09:34
閱讀 3706·2021-09-01 11:29
閱讀 3088·2019-08-30 11:01
閱讀 853·2019-08-29 17:10
閱讀 891·2019-08-29 12:48
閱讀 2789·2019-08-29 12:40
閱讀 1363·2019-08-29 12:30
