Vueの変異ソート＆逆ソートレビュー

<！DOCTYPE HTML> 
<HTML LANG = "EN"> 
<HEAD> 
    <メタ文字コード= "UTF-8"> 
    <スクリプトSRC = "vue.js"> </ SCRIPT> 
    <タイトルID = "タイトル"> {{タイトル}} </ TITLE> 
</ HEAD> 
<BODY> 
の<divのid = "頼む"> <！ - VUE不能控制ボディ和のhtml的标签- > 
    <UL> 
        <LIのV- ための = "（V、リストにおけるk） "> 
           {{v.id}} ===== {{v.content}} <ボタンVオン：クリック="（k）を取り除く">删除</ボタン> 
        </ LI> 
    < / UL> 
    <TEXTAREAのV字モデル= "コンテンツ" COLS = "30"行= "10"> </ TEXTAREA> <BR>
    <ボタンVオン：=クリックし 、 "プッシュ（ '前'）"> フロント</ボタン>に投稿
    <ボタンV-ON：クリック= "プッシュ（ '末端は、'）"> </ button>の後ろのまま 
    BR < >
    <ボタンV-上：クリック= "デル （ '最初'）"> 最初の</ button>を削除
    <ボタンVオン：=クリックし 、 "デル（ '最後'）"> 最後の</ button>の削除
    <BR> 
    <ON-Vボタン：クリック= "ソート">並べ替え</ button>の
    ON-V <ボタン： <逆> = "リバース"をクリック/ボタン> 
</ div> 
<SCRIPT> のvar VUE = 機能（オプション）{ 新しい新しいヴュー（オプション）}; 
    VUE（{ 
        EL： '#title' 、
        データ：{ 
            タイトル： "ソート＆リバース突然変異法のVueのレビューソート' 
        } 
    }）; VARのApp = VUE（{ 
        EL： ' #ask " 、
        データ：{ 
            コンテンツ：'' 、
            リスト：[
    
    
                { 'ID' :. 3、 'コンテンツ'： 'ask.mykeji.net' }、
                { 'ID' :. 5、 'コンテンツ'： 'シンプルなレコード' }、
                { 'ID'：2、 'コンテンツ'：「個々ブログ' }、
                { ' ID '：1、'コンテンツ'：'研究ノート}、
                { 'ID' :. 4、 'コンテンツ'： '何を学ぶために何を学びたい} 
            ] 
        }、
        メソッド：{ 
            リバース（）{ 
                戻り この; .list.reverse（）
            }、
            ソート（）{ 
                この .list.sort（関数（Aを、
                    B）{ 戻り a.id> b.idと、
                }）
            }、
            {（k）を除去する
                この .list.splice（K、1 ）
            }、
            プッシュ（タイプ）{ 
                VARの IDを= この .list.length + 1 。
                VaRの content_push = {ID：ID、 'コンテンツ'：この.content}。
                スイッチ（タイプ）{
                     ケース '予備' ：
                         この.list.unshift（content_push）。
                        破ります;
                    ケース "終わり" ：
                         この.list.push（content_push）。
                        破ります; 
                } 
                この .content = '' ; 
            }、
            デル（タイプ）{ 
                スイッチ（タイプ）{
                     ケース '最初の' ：
                         この.list.shift（）。
                        破ります;
                    ケース "最後の" ：
                         この.list.pop（）;
                        破ります; 
                } 
            } 
        } 
    }）。

</スクリプト> 
</ BODY> 
</ HTML>
Vueの変異ソート＆逆ソートレビュー

おすすめ
