vuejs-chat-example

by turtur

HTML

<script src="https://www.gstatic.com/firebasejs/3.6.6/firebase.js"></script>
<script>
  // Initialize Firebase
  var config = {
    apiKey: "AIzaSyCgkJfO2Q072WSKM-FN06Pmz9HlwoeykQA",
    authDomain: "chat-test-b680f.firebaseapp.com",
    databaseURL: "https://chat-test-b680f.firebaseio.com",
    storageBucket: "chat-test-b680f.appspot.com",
    messagingSenderId: "700152428379"
  };
  firebase.initializeApp(config);
  var database = firebase.database();
  var starCountRef = firebase.database().ref('room1');
starCountRef.on('value', function(snapshot) {
console.log(snapshot.val());
  //updateStarCount(postElement, snapshot.val());
});
</script>

<script src="https://unpkg.com/vue/dist/vue.js"></script>
<div id="app">
	<chat-box></chat-box>
</div>

<template id="chat-box">
	<div class="chat-box-container">
		<div class="chat-message-container">
			<div>
				<chat-message v-for="item in list" :text="item"></chat-message>				
			</div>

		</div>
		<div class="chat-input-container">
			<button>파일</button>
			<input type="text" placeholder="메시지">
			<button>전송</button>
		</div>
	</div>
</template>

<template id="chat-message">
	<div>
		{{text}}
	</div>
</template>