SQL時間是null，前端不想顯示1-1-1

vue.js

terpoo1250 2019-11-25 15:55:21 ‧ 1377 瀏覽

分享至

後端SQL內的Time是Null值，但是前端(Vue.js)抓到的時間值為null並顯示為1-1-1，請問有甚麼方法可以改成顯示：『無契約時間』這樣的文字出來嗎？

model:

public DateTime StartDate { get; set; }

view:

 <el-table-column prop="Customer.StartDate"
                       label="契約日期"
                       :formatter="formatDate"
                       min-width="70">
 </el-table-column>

dragonH iT邦超人 5 級 ‧ 2019-11-25 16:03:07 檢舉

let TimeFormat = '無契約時間';
if (Time) {
TimeFormat = Time;
}

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

3 個回答

舜~

iT邦高手 1 級 ‧ 2019-11-25 16:04:50

用js去判斷呢??
在您的model中

public DateTime StartDate { get; set; }

調整get，如果空值或1-1-1 就回傳無契約時間字串

public DateTime StartDate = {
    a : null,
    get a(){
        if(this.a)
            return this.a;
        else
            return '無契約時間';
    },
    set a(x){this.a = x;}
};

參考
浅谈 JS 对象添加 getter与 setter 的5种方法以及如何让对象属性不可配置或枚举
 Getter 和 Setter 的定義

回應 3
分享
檢舉

terpoo1250 iT邦新手 5 級 ‧ 2019-11-25 16:12:39 檢舉

請問這個，我該...怎麼修改?

舜~ iT邦高手 1 級 ‧ 2019-11-25 17:37:31 檢舉

浅谈 JS 对象添加 getter与 setter 的5种方法以及如何让对象属性不可配置或枚举
 Getter 和 Setter 的定義

terpoo1250 iT邦新手 5 級 ‧ 2019-11-25 17:42:17 檢舉

謝謝，我看一下~

登入發表回應

ckp6250

iT邦好手 1 級 ‧ 2019-11-25 21:51:33

SQL 的事，SQL 解決，才是斧底抽薪之計。

如果是 Mysql 的話，那麼就用

select ifnull(Time,'無契約時間') AS Time
from ........

前端拿到什麼秀什麼，就不用再勞神。

回應 4
分享
檢舉

看更多先前的回應...收起先前的回應...

terpoo1250 iT邦新手 5 級 ‧ 2019-11-26 14:06:57 檢舉

可是，我在model上面試設定

public DateTime StartDate { get; set; }

這樣一樣會顯示得出來嗎？

ckp6250 iT邦好手 1 級 ‧ 2019-11-26 14:13:37 檢舉

　　當然啊，由 sql 撈到前端時，有時間秀時間，沒時間秀『無契約時間』，根本不需要再做判斷。

https://codertw.com/%E7%A8%8B%E5%BC%8F%E8%AA%9E%E8%A8%80/634234/

terpoo1250 iT邦新手 5 級 ‧ 2019-11-26 15:18:53 檢舉

阿，抱歉，我是用SSMS，不是MYSQL
我剛剛改用CASE判斷，但是還是一樣顯示1-1-1
Code:

SELECT CASE ActiveDateStart
	  when null then '無契約時間'
	  else ActiveDateStart
	  END
	  as StartDate

ckp6250 iT邦好手 1 級 ‧ 2019-11-26 15:37:11 檢舉

您用錯判斷式了，試看看這個

https://stackoverflow.com/questions/32762842/isnull-in-ssrs-expressions

登入發表回應

海綿寶寶

iT邦大神 1 級 ‧ 2019-11-26 09:43:31

<script src="//cdnjs.cloudflare.com/ajax/libs/vue/1.0.26/vue.min.js"></script>
<script src="//rawgit.com/wy-ei/vue-filter/master/dist/vue-filter.min.js"></script>
<div id="app">
  <!--h1>Without Filter:</h1>
  <div v-for="person in list">
    <div>{{person.name}} {{person.birthday}}</div>
  </div-->
  <h1>With Filter:</h1>
  <div v-for="person in list">
    <div>{{person.name}} {{person.birthday | dateOrNull '%D'}}</div>
  </div>
</div>

Vue.filter('dateOrNull', function(d, ...others) {
  return d ? Vue.filter('date')(d, ...others) : "無契約時間";
});
new Vue({
  el: "#app",
  data: {
    list: [{
      name: "John",
      birthday: null
    }, {
      name: "Maria",
      birthday: "2012-04-23T18:25:43.511Z"
    }, ]
  }
});

參考資料來源修改的

選我正解