解決fixed在ios抖動問題

最近公司項目做頁面樣式改版，需要把表單提交按鈕都懸浮到頁面最底部。

用了fixed來使按鈕懸浮，但在ios，頁面超過一屏滑動的時候按鈕會抖動。

<template>
    <div id="main">
        <div class="content">
            <input type="text" placeholder="請輸入XX">
            ...
            <footer>
               <div class="footer">
                  <span>提交</span>
               </div>
             </footer>
        </div> 
    </div>
</template>
<style>
footer .footer{
    width:100%;
    position:fixed;
    bottom:0
}
</style>    

解決辦法就是不要把footer放到和頁面內容一個盒子里，拿出來，如下

<template>
    <div id="main">
        <div class="content">
            <input type="text" placeholder="請輸入XX">
            ...
        </div> 
        <footer>
            <div class="footer">
               <span>提交</span>
            </div>
        </footer>
    </div>
</template>
<style>
footer .footer{
    width:100%;
    position:fixed;
    bottom:0
}
</style>    

這樣做以后，按鈕再也不會亂動了，完美