WeChat アプレット - 値を渡すときの " " と "{{ }}" の違い

MyBtn.js

Component({
    properties:{
        btnName:{
            type:String,
            value:"默认btn"
        },
        num:Number,
        arr:Array
    },
    created(){
        console.log(1000)
        console.log(this.data)
        console.log(typeof this.data)
    }
})

MyBtn.wxml

<button style="background: red;color: #fff;">
    {
   
   {btnName}} {
   
   {num}} {
   
   {arr}}
</button>

こんにちは。wsml

<!--pages/hello/hello.wxml-->
<text>{
   
   {msg}}</text>
<button bindtap="update">修改</button>
<my-btn btnName="{
   
   {'我的按钮'}}"></my-btn>
<!-- <my-btn btnName="按钮2" num="3.14" arr="[1,2,3]"></my-btn> -->
<my-btn btnName="按钮2" num="{
   
   {3.14}}" arr="{
   
   {[1,2,3]}}"></my-btn>

レンダリング

 

配列に直接「」を使用すると、次の警告が表示されます。

このエラー メッセージは、MyBtn コンポーネントの arr 属性が互換性のない値を受け取ったことを示します。このプロパティは配列 (<Array>) を予期していましたが、配列以外の値を受け取りました。この問題を解決するには、MyBtn コンポーネントに渡される arr 属性の値を確認します。配列を渡していることを確認してください。

値を渡す場合、「」内の情報は定義された型に変換されます。" " を使用すると、文字列の型を定義された型に強制することを意味しますが、システムは [ ] を含む文字列を定義された配列 arr に強制することができないため、num は正常に表示できますが、arr は表示できません。

したがって、型付きパラメータを渡したい場合は、補間式、つまり「{ { } }」形式を使用します。