宣告：此文借鑑兩位前輩的博文
感謝這兩位前輩的貢獻！！！
實現功能：把密碼輸入封裝成乙個自定義元件，可以多處呼叫此元件
component部分：
pwdalert.wxml
wx:if="}"
class="password">
class="input-content-wrap">
class="top">
catchtap="close_pwd_alert"
class="close">×view>
class="txt">
}view>
catchtap="modify_password"
class="forget">
view>
view>
class="actual_fee">
}span>
}text>
view>
catchtap="setfocus"
class="input-password-wrap">
class="password_dot">
wx:if="
}">
i>
view>
class="password_dot">
wx:if="
}">
i>
view>
class="password_dot">
wx:if="
}">
i>
view>
class="password_dot">
wx:if="
}">
i>
view>
class="password_dot">
wx:if="
}">
i>
view>
class="password_dot">
wx:if="
}">
i>
view>
view>
view>
bindinput="_pwdevent"
class="input-content"
password
type="number"
focus="}"
maxlength="6" />
view>
page
page
.password
page
.password
.input-content-wrap
page
.password
.input-content-wrap
.top
page
.password
.input-content-wrap
.top
.close
page
.password
.input-content-wrap
.top
.forget
page
.password
.input-content-wrap
.actual_fee
page
.password
.input-content-wrap
.actual_fee
span
page
.password
.input-content-wrap
.actual_fee
text
page
.password
.input-content-wrap
.input-password-wrap
page
.password
.input-content-wrap
.input-password-wrap
.password_dot
page
.password
.input-content-wrap
.input-password-wrap
.password_dot
:nth-child(1)
page
.password
.input-content-wrap
.input-password-wrap
.password_dot
ipage
.password
.input-content
page
.password
.input-content
.active
component( // 屬性被改變時執行的函式（可選），也可以寫成在methods段中定義的方法名字串, 如：'_propertychange'
},currency:,
amt: ,
pwdfull: ,
},//元件的對外屬性
data: ,//私有資料，可用於模版渲染
methods: )
},show_pwd_alert: function
() )
},setfocus: function
() )
},_pwdevent: function
(e) );
if (pwd.length == 6)
//自定義元件觸發事件時，需要使用 triggerevent 方法，指定事件名、detail物件和事件選項
// this.triggerevent("pwdevent")
this.triggerevent("pwdevent",e.detail)
},},
// 內部方法建議以下劃線開頭
_propertychange: function
(newval, oldval)
})
index.wxml
class="page">
style='padding-left:20rpx;padding-right:20rpx;padding-top:100rpx;'>
class="weui-btn"
type="primary"
bindtap="showdialog"
style='clear:both'>showdialogbutton>
view>
id='pwddialog'
pwdtitle="}"
currency="}"
amt="}"
bind:pwdevent="_pwdevent"
bind:close_pwd_alert="close_pwd_alert"
bind:setfocus="setfocus">
pwddialog>
view>
@import
"../../utils/weui.wxss"
;.primaryfont
}
page(,
onready: function () ,
showdialog: function () ,
_pwdevent(e) ,
});
微信小程式自定義元件
父元素 子元件 可以由多個 子元件 a,b,c,d 父元素 首先是關於元件的建立 1 單獨建立乙個資料夾存放 wxss x.js wxml json這四個檔案，其中主要對元件進行宣告的是json檔案，需要寫入 這段 就是讓元件允許被使用，如果元件需要呼叫另乙個元件中，那麼就需要再usingcompe...
微信小程式自定義元件
根據專案需要，抽離出公共的元件。1 在專案根目錄新建乙個component的資料夾，然後新建自己需要的檔案 專案目錄如下 在component裡面我新建了3個子元件。2 子元件的寫法 只有js檔案格式不一樣，其他的檔案都正常寫。js需要自定義乙個component，參考 示例 component d...
微信小程式 自定義元件
建立自定義元件 元件的構成類似頁面，由json wxml wxss js 4個檔案組成。在新建乙個元件的時候需要在元件的json檔案中設定 components 字段 true 在元件wxss中不應使用id選擇器 屬性選擇器和標籤名選擇器。這句是官方說的，我想應該是會全域性汙染 自定義元件的js檔案...