elementUI+vue修改文件名（不是文件夾的話只修改名字，不修改後綴名）的實現方法

不做不知道，一做就懵了。

今天遇到一個需求：如果是文件夾就可以直接修改名字，如果不是文件夾，是一個有後綴名的文件，那麼只修改除後綴名之外的部分

修改文件夾：

修改有後綴名的文件：

直接上結果：

方法一：

用一個存儲變量來存儲有後綴名的前綴，然後進行雙向綁定，之後用戶改變了input中的值後再把存儲變量的值賦值給原來的filename:

用一個存儲變量來存儲文件的前綴：

進行雙向綁定：

數據發生改變後進行傳送賦值：

此方法工作量多，還要進行循環，感覺有點麻煩。

方法二：

不用聲明一個存儲變量，直接綁定前綴，不過不是雙向綁定，是手動賦值，原因後面再說：

相比較來說，第二種方法更爲簡單。

拓展原因

在沒有引入elementUI的時候，雙向綁定可以這樣實現：

valueChange(event)或者valueChange()結果都能打印event對象

 

而引入了elementUI後：

只有changeMessage()這樣纔會打印出event對象出來

如果添加上形參的話，再改變值就會報錯，而且達不到改變值得效果：

總結：

v-model如果引入了方法，那麼不會實現數據雙向綁定，只有通過手動去修改，雙向綁定是沒有 任何效果得

在引入了elementUI後不要寫形參就可以拿到event對象了

 以上有任何問題可以留言，勿噴。